/* Normalize.css http://necolas.github.io/normalize.css/2.1.3/normalize.css Use this in preference to the classic 'reset' options http://www.cssreset.com/which-css-reset-should-i-use/ as it is lighter and less confusing/easier to analyse. ===================== */ article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {display: block;} audio:not([controls]) {display: none; height: 0;} [hidden], template {display: none;} html {font-family: arial, sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;} body {margin: 0;} a {background: transparent;} a:focus {outline: thin dotted;} a:active, a:hover {outline: 0;} h1 {font-size: 2em; margin: 0.67em 0;} abbr[title] {border-bottom: 1px dotted;} b, strong {font-weight: bold;} dfn {font-style: italic;} hr {-moz-box-sizing: content-box; box-sizing: content-box; height: 0;} mark {background: #ff0; color: #000;} code, kbd, pre, samp {font-family: monospace, serif; font-size: 1em;} pre {white-space: pre-wrap;} q {quotes: "\201C" "\201D" "\2018" "\2019";} small {font-size: 80%;} sub, sup {font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;} sup {top: -0.5em;} sub {bottom: -0.25em;} img {border: 0;} svg:not(:root) {overflow: hidden;} figure {margin: 0;} fieldset {border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em;} legend {border: 0; padding: 0;} button, input, select, textarea {font-family: inherit; font-size: 100%; margin: 0;} button, input {line-height: normal;} button, select {text-transform: none;} button, html input[type="button"], input[type="reset"], input[type="submit"] {-webkit-appearance: button; cursor: pointer;} button[disabled], html input[disabled] {cursor: default;} input[type="checkbox"], input[type="radio"] {box-sizing: border-box; padding: 0;} input[type="search"] {-webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box;} input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {-webkit-appearance: none;} button::-moz-focus-inner, input::-moz-focus-inner {border: 0; padding: 0;} textarea {overflow: auto; vertical-align: top;} table {border-collapse:collapse; border-spacing:0;} /* HTML tags the streamSWEET way ===================== */ body {font-family:Arial, sans-serif; font-size:14px; line-height:19px; margin:0; background-color:#f0f0f0; color:#333;} p {margin:2px 0 8px 0;} h1 {font-size:32px; font-weight:bold; color:#522e91; line-height:32px; margin:2px 0 20px 0;} h2 {font-size:22px; font-weight:bold; color:#522e91; line-height:26px; margin:2px 0 16px 0;} h3 {font-size:19px; font-weight:normal; color:#522e91; line-height:24px; margin:2px 0 16px 0;} h4 {font-size:16px; font-weight:bold; color:#522e91; line-height:19px; margin:2px 0 5px 0;} h5 {font-size:14px; font-weight:bold; color:#000; margin:10px 0px 2px 0px; margin:2px 0 4px 0;} h6 {font-size:12px; font-weight:bold; color:#999; margin:10px 0px 2px 0px; margin:2px 0 2px 0;} blockquote {quotes:none; font-style:italic;} hr {border-top-width:2px; border-top-style:solid; border-right-style:none; border-bottom-style:none; border-left-style:none; border-top-color:#eaeaea; margin-right:0px; margin-left:0px;} img {border:0; display:block; max-width:100%; height:auto; width:auto\9; /* ie8 */} a {margin:0; padding:0; font-size:100%; font:inherit; vertical-align:baseline; background:transparent;} a:link, a:visited {color:#333; text-decoration:underline;} a:active, a:hover, a:focus {color:#522e91; text-decoration:underline;} /* streamSWEET additional Fonts ===================== */ .TextStd {} .TextEmphasis {color:#999; font-style:italic;} .TextPurple {color:#522e91;} .TextOrange {color:#fd9827;} .TextStrong {font-weight:bold;} .TextSml1 {font-size:12px; color:#666; line-height:13px;} .TextSml2 {font-size:11px; color:#999; line-height:12px;} .TextLarge {font-size:18px; line-height:22px;} .TextQuote {font-size:14px; font-weight:bold; color:#4898d4; line-height:18px; font-style:italic;} .TextLabel {font-size:12px !important; color:#777 !important; vertical-align:top;} .TextBold {font-weight:bold;} /* streamSWEET In-page alert panels /*For 'background-image' Possibly good to include -webkit... to support Mac Safari. That browser gained proper support only from early 2013*/ .InPagePanelAlert {width:90%; margin:20px; padding:15px; font-size:1.2em; background-color:#ffecd9; background-image:linear-gradient(0deg, #ffecd9, #fcf7f2 90%); border:1px solid #ff9c2b; border-radius:10px; box-shadow:0 0 20px 0px #ffdbd9;} .InPagePanelTitle {font-size:1.3em;} .InPagePanelEmphasis {font-style:italic;} .InPagePanelAlert a {font-weight:bolder;} /* streamSWEET predefined tables ===================== */ .Table1 {border-collapse:collapse; border:1px solid #b7b8b8;} .Table1Head {background-color:#3c3c3c; padding:5px 5px 5px 3px; font-size:14px; font-weight:bold; color:#f7f7f7; text-align:left; border:1px solid #b7b8b8;} .Table1SubHead {background-color:#d4d4d4; padding:3px 3px 3px 3px; font-size:12px; font-weight:bold; border-top:1px solid #b7b8b8; border-bottom:1px solid #b7b8b8;} .Table1Content {background-color:#fbfbfb; padding:2px 2px 2px 3px; font-size:12px; border-top:1px solid #b7b8b8; border-bottom:1px solid #b7b8b8;} /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ /*Above here is generic with the admin CMS editors, apart from BODY background colour and margin.*/ /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ /* Font - Legacy Support until replaced throughout the code. Meantime manually align with h1 h2 etc tags above and text classes used above. ===================== */ .Head1 {font-size:32px; font-weight:bold; color:#522e91; line-height:36px;} .Head2 {font-size:24px; font-weight:bold; color:#522e91; line-height:28px;} .Head3 {font-size:20px; font-weight:normal; color:#522e91; line-height:26px;} .Head4 {font-size:16px; font-weight:bold; color:#522e91; line-height:21px;} .Text1 {font-size:14px; color:#333;} .Text2 {font-size:14px; color:#522e91;} .Text3 {font-size:14px; color:#999; font-style:italic;} /* ======================================================================================== */ /* ======================================================================================== */ /* Template Layout */ /* ======================================================================================== */ /* ======================================================================================== */ /* Generic container for each logical section of the page - creates horizontal 'slices' of content at full screen width */ .wrapper {clear:both; margin:0 auto; padding:0; position:relative; max-width:1100px;/*width:80%;*/} /* This new class group is used to replace clearfix */ .group:after {content:""; display:table; clear:both;} /* Home ===================== */ .hBanner {padding:0px; text-align:left; vertical-align:top; background:url(/assets/images/tile_banner.jpg) #713a97 no-repeat center top; background-size:100% auto; /*contain;*/ } .hNavMain {height:150px; border-bottom:3px solid #ebe6ed; background-color:#fff;} .hNavPadding {margin-top:30px;} .hLogin {float:right;} .hBasket {padding:8px 4px; float:right; min-width:70px; color:#fff; margin-left:0px; margin-right:10px; font-size:12px; text-align:center;} .hBasket a:link, .hBasket a:visited {color:#fff; text-decoration:none;} .hBasket a:hover, .hBasket a:active {color:#fff; text-decoration:underline;} .hContact {padding:8px 12px; float:right; color:#fff; margin-left:0; margin-right:0; font-size:12px; text-align:center;} .hContact a:link, .hContact a:visited {color:#fff; text-decoration:none;} .hContact a:hover, .hContact a:active {color:#fff; text-decoration:underline;} .hSocial {padding:8px 12px; float:left; color:#fff; margin-left:0; margin-right:0; font-size:12px; text-align:center;} .hNavBottom {margin-left:auto; margin-right:auto;} .hFooterInfo {margin-left:auto; margin-right:auto; padding-left:0px; padding-top:20px;} .hBreadcrumbs {padding:0px 0px 0px 20px;} .hPage {padding:50px 0; text-align:left; width:85%; margin-left:auto; margin-right:auto;} .hContent1 {padding:50px 0 0 0; text-align:left; width:85%; margin-left:auto; margin-right:auto;} .hContent1Demo {padding:50px 0; text-align:left; width:85%; margin-left:auto; margin-right:auto;} .hContent2 {padding:20px 0; text-align:left; width:94%; margin-left:auto; margin-right:auto;} .hContent2Demo {padding:20px 0; text-align:left; width:94%; margin-left:auto; margin-right:auto;} .hFooter {padding:25px; vertical-align:top; color:#585958; height:100px; margin-bottom:30px;} /* Content - Standard ===================== */ #cLayout {z-index:1;} .OuterShadowBox {-webkit-box-shadow:0 0 5px 5px rgba(76, 76, 76, 0.1); -moz-box-shadow:0 0 5px 5px rgba(76, 76, 76, 0.1); box-shadow:0 0 5px 5px rgba(76, 76, 76, 0.1); padding:0; background-color:#fff;} .cBanner {padding:0px; text-align:left; vertical-align:top; background:url(/assets/images/tile_banner.jpg) #713a97 no-repeat center top; background-size:100% auto; /*contain;*/ } .cBannerCol1 {width:300px; float:left; height:160px;} .cBannerCol2 {width:662px; float:left; height:160px;} .cNavMain {height:90px; border-bottom:3px solid #ebe6ed; background-color:#fff;} .cNavSub {padding:0px 0px 5px 0px; background-color:#fff; vertical-align:top;} /* Make Sub Nav disappear at 480px */ @media only screen and (max-width: 480px) { .cNavSub {display:none;} } .cLogin {float:right;} .cPage {padding:30px 0; text-align:left;} .cBasket {padding:8px 4px; float:right; min-width:70px; color:#fff; margin-left:0px; margin-right:10px; font-size:12px; text-align:center;} .cBasket a:link, .cBasket a:visited {color:#fff; text-decoration:none;} .cBasket a:hover, .cBasket a:active {color:#fff; text-decoration:underline;} .cNavBottom {padding:10px 0;} .cFooterInfo {margin-left:auto; margin-right:auto; padding-top:20px;} .cNavBreadcrumbs {} .cContent1 {width:94%; margin-left:auto; margin-right:auto; padding:20px 0 20px 0; background-color:#fff; text-align:left; vertical-align:top;} .cContent1FullWidth {padding:0px 20px 10px 20px; text-align:left; vertical-align:top; border-left:1px solid #ccc; border-right:1px solid #ccc; border-collapse:collapse; background-color:#fff; height:360px;} .cContent2 {width:94%; margin-left:auto; margin-right:auto; padding:0px; background-color:#fff; text-align:left; vertical-align:top;} .cFooter {padding:25px; vertical-align:top; color:#585958; height:100px; margin-bottom:30px;} .SpacerNoWidth {background-color:#fff;} /* This is old staff already and we should use group handling for this */ .clearfix:after {visibility:hidden; display:block; font-size:0; content:""; clear:both; height:0;} .clearfix {display: inline-block;} /* start commented backslash hack \*/ * html .clearfix { height: 1%; } .clearfix { display: block; } /* close commented backslash hack */ /* COLUMN LAYOUTS ===================== */ /* Homepage Column Layouts ===================== */ /* 1 Column */ .hContentCol1of1 {min-height:400px; padding:20px 20px 20px 20px;} /* 2 Columns */ .hContentContainer2of2 {width:990px; overflow:hidden; position:relative;} /* Background for ConteTableDataCoursesSubHeadnt 1 */ .hContentContainer1of2 {float:left; width:990px; position:relative; right:828px;} /* Background for left Side */ .hContentCol1of2 {float:left; width:160px; position:relative; left:828px; min-height:600px;} /* Content for left Side */ .hContentCol2of2 {float:left; width:744px; position:relative; left:852px; padding:0px 20px 20px 0px;} /* Content for Content 1 */ /* Content Column Layouts ===================== */ /* 1 Column */ .cContentCol1of1 {background:#fff; min-height:600px; padding:10px 20px 20px 15px;} /* Make Divs have columns that are all the same height - technique explained here: http://matthewjamestaylor.com/blog/equal-height-columns-cross-browser-css-no-hacks */ /* 2 Columns */ .cContentContainer2of2 {width:990px; overflow:hidden; position:relative;} /* Background for Content 1 */ .cContentContainer1of2 {float:left; right:824px; width:990px; background-image:url(/assets/images/subnav_side.png); position:relative;} /* Background for left nav f2f2f3*/ .cContentCol1of2 {float:left; left:824px; width:166px; position:relative; min-height:600px; overflow:hidden;} /* Content for left Nav */ .cContentCol2of2 {float:left; left:824px; width:780px; margin-left:34px; min-height:600px; margin-right:10px; position:relative; overflow:hidden;} /* Content for Content 1 */ /* 3 Columns */ .cContentContainer3of3 {width:966px; background:#f4f4f4; overflow:hidden; position:relative;} /* Background for Content 2 */ .cContentContainer2of3 {float:left; width:966px; background:#fff; position:relative; right:184px;} /* Background for Content 1 */ .cContentContainer1of3 {float:left; width:964px; background-color:#f2f2f2; border-right:2px solid #f2f2f2; position:relative; right:598px;} /* Background for left nav f2f2f3*/ .cContentCol1of3 {float:left; width:184px; position:relative; left:782px; min-height:600px; background-color:#f2f2f3; overflow:hidden;} /* Content for left Nav */ .cContentCol2of3 {float:left; width:563px; position:relative; left:782px; min-height:600px; padding:20px 20px 20px 15px; overflow:hidden;} /* Content for Content 1 */ .cContentCol3of3 {float:left; width:162px; position:relative; left:782px; min-height:600px; padding:20px 10px 20px 10px;} /* Content for Content 2 */ /* ======================================================================================== */ /* ======================================================================================== */ /* Content - Coded outputs */ /* ======================================================================================== */ /* ======================================================================================== */ /* Table ===================== */ .TableBorder {background-color:#fff; border:1px solid #888; margin-top:1px;} .TableBasic {border-width:0px; width:100%;} /* should probably be reworked, because this has been moved from rugby for a handful of controls that we placed in streamSWEET. */ /* These controls are still not made part of the system properly, so we can either update them to use generic styles, or remove styles and controls */ /* usercontrol\front\custom\CreditsLogBought.ascx */ /* usercontrol\front\custom\CreditsLogUsed.ascx */ /* usercontrol\front\Network\FriendsResultsList.ascx */ /* usercontrol\front\Network\MyFriends.ascx */ .AccountTable {margin-bottom:6px;} .AccountTable td {padding:4px 2px;} .AccountTable th {text-align:left; background-color:#fff; border:2px solid #cde9b4; font-size:15px; padding:6px; background-image:url(/assets/images/tile_header_profile.jpg); background-repeat:repeat-x;} .AccountTableLeft {text-align:left; font-weight:bold; background-color:#fff; border-top:2px solid #cde9b4; border-left:2px solid #cde9b4; border-bottom:2px solid #cde9b4; font-size:15px; padding:6px; background-image:url(/assets/images/tile_header_profile.jpg); background-repeat:repeat-x;} .AccountTableCenter {text-align:left; font-weight:bold; background-color:#fff; border-top:2px solid #cde9b4; border-bottom:2px solid #cde9b4; font-size:15px; padding:6px; background-image:url(/assets/images/tile_header_profile.jpg); background-repeat:repeat-x;} .AccountTableRight {text-align:left; font-weight:bold; background-color:#fff; border-top:2px solid #cde9b4; border-right:2px solid #cde9b4; border-bottom:2px solid #cde9b4; font-size:15px; padding:6px; background-image:url(/assets/images/tile_header_profile.jpg); background-repeat:repeat-x;} .AccountTableSub {background-image:url(/assets/images/tile_account_sub.jpg); background-repeat:repeat-x; border-bottom:1px solid #ccc;} /* Grid ===================== */ .datagridTable {color:#f60; background-color:#fff;} .dataGridCont {border:1px solid #7b5c98;} .datagrid {font-size:12px; background-color:#fff;} .datagrid td {padding:1px 0 1px 4px !important; border-bottom:1px solid #fff;} .datagrid td:last-of-type {padding-right:5px !important;} .datagrid td a {text-decoration:none; display:block; padding:4px 4px 4px 0px;} .datagridAlter {background-color:#f5f5f5;} .datagridAlter td {padding:1px 0 1px 4px !important; border-bottom:1px solid #f5f5f5;} .datagridAlter td:last-of-type {padding-right:5px !important;} .datagridAlter td a {text-decoration:none; display:block; padding:4px 4px 4px 0px;} .datagridSelected {background-color:#dacbf0;} .datagridSelected td {padding:1px 0 1px 4px !important; border-bottom:1px solid #c1c7b5;} .datagridSelected td:last-of-type {padding-right:5px !important;} .datagridSelected td a {text-decoration:none; display:block; padding:4px 4px 4px 0px;} .datagridOver {background-color:#eae8f7;} .datagridOver td {padding:1px 0 1px 4px !important; border-bottom:1px solid #e8e8bc;} .datagridOver td:last-of-type {padding-right:5px !important;} .datagridOver td a {text-decoration:none; display:block; padding:4px 4px 4px 0px;} /* datagridHeader is only applied to the header row of non-sortable, non drag n drop grids. */ .datagridHeader {padding:0;} .datagridHeader td {padding:4px 2px 4px 4px !important;} .datagridColumn {font-size:11px; color:#fff; font-weight:normal; background-color:#7b5c98; padding:4px 2px 4px 4px !important;} .datagridColumn a {text-decoration:none; color:#fff;} .datagridColumnSelected {font-size:11px; color:#fff; font-weight:bolder; background-color:#a5a7b3; padding:4px 2px 4px 4px !important;} .datagridPager {font-size:10px; color:#006; font-weight:normal; background-color:#e5e6e7;} .datagridPager a {padding-right:3px; display:inline-block !important;} /* drag and drop grid */ .HypergridTableHeader {overflow:hidden; width:100%; table-layout:fixed; empty-cells:show; border-collapse:collapse;} .HypergridTableHeader th {padding:4px 2px 4px 4px;} .DivDragDropImage {margin-left:auto; margin-right:auto; width:16px; height:16px; text-align:center; background-image:url(/assets/images/icon_sort_up_down.gif);} .RadGridDragDropEnabled {cursor:move;} .rgPager .rgCurrentPage {text-decoration:none; color:Black;} .rgPager .rgInfoPart {display:none;} /* Tabs ===================== */ .tabspanelcont {height:35px;} .tabspanel {float:left; width:100%; font-size:90%; line-height:normal; border-bottom:2px solid #505050;} .tabspanel ul {margin:0; padding:0px 10px 0 10px; list-style:none;} .tabspanel li {display:inline; margin:0; padding:0;} .tabspanel a {float:left; background:url(/assets/images/tabspanelleft.gif) no-repeat left top; margin:0; padding:0 0 0 5px; text-decoration:none; background-position:0% -42px;} .tabspanel a span {float:left; display:block; background:url(/assets/images/tabspanelright.gif) no-repeat right top; padding:10px 15px 6px 10px; color:#000; background-position:100% -42px;} .tabspanelon a {float:left; background:url(/assets/images/tabspanelleft.gif) no-repeat left top; margin:0; padding:0 0 0 5px; text-decoration:none;} .tabspanelon a span {float:left; display:block; background:url(/assets/images/tabspanelright.gif) no-repeat right top;padding:10px 15px 6px 10px; color:#000;} .tabspanel a:hover {background-position:0% 0px;} .tabspanel a:hover span {color:#ff6600; background-position:100% 0px;} /* Stream ===================== */ /* Alert Message Handling */ .AlertBox {width:350px; margin:0; padding:0; border-radius:10px; box-shadow:0 0 20px 0px #ffdbd9; overflow:hidden; cursor:auto; position:fixed; bottom:20px; right:20px; z-index:10000;} .AlertBoxInner {padding:10px 10px 10px 70px; overflow:hidden; z-index:9999;} .AlertBoxTitle {margin:5px 0 0 0; font-size:24px; font-weight:bold; color:#333;} .AlertBoxText {margin:15px 10px 10px 0; font-size:1.1em; color:#333;} .AlertBoxSuccess {background-color:#d0fbc1; border:1px solid #54FF54;} .AlertBoxInnerSuccess {background-image:url('/assets/images/msg_type_01_01.gif'); background-repeat:no-repeat; background-position:5px 10px;} .AlertBoxError {background-color:#fbc8c1; border:1px solid #FF2B2B;} .AlertBoxInnerError {background-image:url('/assets/images/msg_type_02_01.gif'); background-repeat:no-repeat; background-position:5px 10px;} .AlertBoxInfo {background-color:#fee1ab; border:1px solid #FFAE17;} .AlertBoxInnerInfo {background-image:url('/assets/images/msg_type_03_01.gif'); background-repeat:no-repeat; background-position:5px 10px;} /* No Results Handling */ .AlertNoResult {padding:10px; border:1px solid #e5e5e5; background:#f7f7f7;} /* Telerik ===================== */ .TabHover {color:#039} .TabDisabled {color:#999;} /* Over-ride telerik generated styles */ .rwControlButtons li {list-style-type:none;} .rcbHeader ul, .rcbHeader ul li,.rcbFooter ul,.rcbFooter ul li, .rcbItem ul, .rcbItem ul li,.rcbHovered ul,.rcbHovered ul li, .rcbDisabled ul,.rcbDisabled ul li {list-style-type:none !important; margin:0px; padding:0px;} /* Modal ===================== */ .modalBackground {background-color:Gray;} .modalPopup {display:none;} /* Tool Tip ===================== */ /* Footer ===================== */ .FooterText {font-size:9px; color:#666; line-height:15px;} .FooterText a:link, .FooterText a:visited {color:#666; text-decoration:underline;} .FooterText a:hover, .FooterText a:active {color:#f60; text-decoration:underline;} /* File Upload ===================== */ .FileUploadHeader {font-size:12px; font-weight:bold; color:#464c55; background-color:#c1d82f; padding:4px; border-bottom:1px solid #666;} /* Ajax Popup ===================== */ /* shop */ .FormTopPopup {background-image:url(/assets/images/tile_stripe.jpg); background-repeat:repeat-x; color:#fff; font-weight:bold; padding-left:15px;} .FormButtonPopup {padding:6px 12px 6px 12px; font-size:14px; color:#393b4a; background-image:url(/assets/images/tile_ajaxform_header.jpg); background-repeat:repeat-x; background-color:#b0becd; border:inset 1px #708090; text-decoration:none;} /* feedback only */ .FormTablePopup {padding:0; margin-left:auto; margin-right:auto; background-color:#fff;} /* carried from rugby - PayPal popup, Login Message popup */ .FormHeaderPopup {padding:5px 30px; font-size:16px; font-weight:bold; color:#fff; background-image:url(/assets/images/tile_ajaxform_header.jpg); background-repeat:repeat-x;} .FormHeaderPopup {padding:3px; font-size:14px; font-weight:bold; color:#393b4a; background-image:url(/assets/images/tile_ajaxform_header.jpg); background-repeat:repeat-x;} /* \PayPal_HTML.aspx */ /* \usercontrol\front\custom\BuyCredits.ascx */ .CreditDisplay {font-size:14px; color:#000; padding:6px 10px; background-color:#dbefde; border:1px solid #6eaf4e;} /* PayPal popup - \PayPal_HTML.aspx */ .TableBuyStuff {width:100%; margin:10px 0px; border-top:2px solid #000; border-bottom:2px solid #000;} .TableBuyStuff th {background-color:#f1eded; padding:4px;} .TableBuyStuff td {padding:4px;} /* BUY NOW POP-UP */ /* ref:http://www.sohtanaka.com/web-design/inline-modal-window-w-css-and-jquery/ */ #fade {display:none; background:#000; position:fixed; left:0; top:0; width:100%; height:100%; opacity:.80; z-index:9999;} .popup_block {display:none; background:#fff; padding:0px; border:2px solid #ddd; float:left; position:fixed; top:50%; left:50%; z-index:99999;} /* ======================================================================================== */ /* ======================================================================================== */ /* Forms */ /* ======================================================================================== */ /* ======================================================================================== */ /* Form Elements ===================== */ textarea:focus, input:focus, select:focus {outline:none; box-shadow: 0 0 10px 0px #ccc;} textarea:focus, input:focus {background-color:#fffaed;} textarea:disabled, input:disabled, select:disabled, submit:disabled {box-shadow: 0 0 8px 0px #fab9b9;} /* TextArea ===================== */ /* TextBox ===================== */ .FormTextBox {padding:4px; font-size:12px; color:#000; background-color:#fff; border:2px solid #e8e8e8;} .FormTextBox_ReadOnly {padding:4px; font-size:12px; color:#000; background-color:#fff; border:2px solid #e8e8e8;} .FormTextBoxGreen {padding:4px; font-size:12px; color:#000; background-color:#b8eba9;} /* Password ===================== */ /* Pulldown List ===================== */ .FormPulldown {height:27px !important; padding:4px; font-size:12px; color:#000; background-color:#fff; border:2px solid #e8e8e8;} .FormPulldownLanguage {padding:4px 6px; font-size:10px; color:#666; background-color:#e9f4f3; margin:10px;} .FormPulldownSection {padding:4px; font-size:12px; color:#446f83; background-color:#e9f4f3; margin:10px;} /* Select List ===================== */ /* Checkbox ===================== */ /* Radio button ===================== */ /* Input ===================== */ .FormInvalid {padding:4px; font-size:12px; color:#000; background-color:#fbb5b3; border:2px solid #e8e8e8;} /* Captcha ===================== */ /* Form Tables ===================== */ .FormTable {padding:0px; margin-top:8px; margin-bottom:8px;} .FormTable th {font-size:16px; color:#7b5c98; font-weight:normal; padding:10px 15px 9px 15px; background-color:#e8e6eb; text-align:left;} .FormTable td {font-size:14px; line-height:19px; color:#666; padding:4px 6px;} .FormTableHead {font-size:14px; color:#333; font-weight:bold; padding:7px 5px 5px 15px; border:1px solid #bebebe;} .FormCellHeadSub {font-size:14px; color:#000; font-weight:bold; padding:4px 3px; background-color:#f7f8fd;} .FormSectionTop {border:1px solid #888; margin-top:1px;} .InstructTextSml {font-size:11px; color:#999;} .FormRequired {font-size:14px; color:#f60;} .ErrStdRed {font-size:11px; color:#f00; vertical-align:top} /* Buttons ===================== */ .FormButton {padding:8px 12px 8px 12px; font-size:14px; color:#522e91; background-color:#c5bcd6; border:0; text-decoration:none; margin:5px 0;} .FormButton:hover {padding:8px 12px 8px 12px; font-size:14px; color:#713a97; background-color:#d4cee1; border:0; text-decoration:none; cursor:pointer;} .FormButtonSubmit {padding:8px 12px 8px 12px; font-size:14px; color:#522e91; background-color:#c5bcd6; border:0; text-decoration:none; margin:5px 0;} .FormButtonSubmit:hover {padding:8px 12px 8px 12px; font-size:14px; color:#713a97; background-color:#d4cee1; border:0; text-decoration:none; cursor:pointer;} /* SWAP OUT FORM ELEMENTS FOR GRAPHICS ===================== */ .checkbox, .radio {background-image:url(/assets/images/quiz/checkbox2.png); background-repeat:no-repeat; display:block; width:38px; height:50px; padding:0 5px 0 0; clear:left; float:left;} .radio {background-image:url(/assets/images/radio2.png); background-repeat:no-repeat;} .select {position:absolute; width:158px; /* With the padding included, the width is 190 pixels:the actual width of the image. */ height:21px; padding:0 24px 0 8px; color:#fff; font:12px/21px arial,sans-serif; background:url(/assets/images/select.png) no-repeat; overflow:hidden;} /* Image Buttons ===================== */ /* EVENT */ .ImgBtnEventAdd {width:0px; height:0px; background:url(/assets/images/button_add_event.gif) no-repeat 0px 0px; margin:0; padding:0;border:none; background-color:transparent; cursor:pointer; display:inline-block;} .ImgBtnEventRemove {width:0px; height:0px; background:url(/assets/images/button_remove_event.gif) no-repeat 0px 0px; margin:0; padding:0;border:none; background-color:transparent; cursor:pointer; display:inline-block;} .ImgBtnEventFind {width:0px; height:0px; background:url(/assets/images/button_find_events.gif) no-repeat 0px 0px; margin:0; padding:0;border:none; background-color:transparent; cursor:pointer; display:inline-block;} .ImgBtnReportFind {width:0px; height:0px; background:url(/assets/images/button_find_report.gif) no-repeat 0px 0px; margin:0; padding:0;border:none; background-color:transparent; cursor:pointer; display:inline-block;} .ImgBtnEventBook {width:102px; height:29px; background:url(/assets/images/button_booknow.gif) no-repeat 0px 0px; margin:6px 0; padding:0;border:none; background-color:transparent; cursor:pointer; display:inline-block;} .ImgBtnEventBook:hover {background:url(/assets/images/button_booknow_on.gif) no-repeat 0px 0px;} .ImgBtnEventBookLge {width:168px; height:51px; background:url(/assets/images/button_booknow_lge.gif) no-repeat 0px 0px; padding:0;border:none; background-color:transparent; cursor:pointer; display:inline-block; margin:8px 0;} .ImgBtnEventBookLge:hover {background:url(/assets/images/button_booknow_lge_on.gif) no-repeat 0px 0px;} /* EVENT MULTIPLE LOCATIONS */ .EventGridTable {width:100%; margin-top:20px; margin-bottom:30px; background-color:#f6f7f5; border:1px solid #cfcfcf;} .EventGridTable th {background-color:#e8e6eb; color:#522e91; font-size:13px; padding:6px 5px;} .EventGridTable td {color:#000; font-size:13px; padding:3px 5px; border-bottom:1px solid #cfcfcf;} /* RUGBY SEARCH */ .ImgBtnSearchGo {width:33px; height:35px; background:url(/assets/images/button_search_go.gif) no-repeat 0px 0px; margin:0; padding:0;border:none; background-color:transparent; cursor:pointer; display:inline-block;} .ImgBtnSearchGoLarge {width:36px; height:28px; background:url(/assets/images/button_go_lge.gif) no-repeat 0px 0px; margin:0; padding:0;border:none; background-color:transparent; cursor:pointer; display:inline-block;} /* FEEDBACK BUTTONS */ .ImgBtnFeedbackSubmit {width:186px; height:38px; background:url(/assets/images/button_submit_feedback.gif) no-repeat 0px 0px; margin:0; padding:0;border:none; background-color:transparent; cursor:pointer; display:inline-block;} .ImgBtnFeedbackIconPlus {width:24px; height:24px; background:url(/assets/images/icon_plus_feedback.gif) no-repeat 0px 0px; margin:0; padding:0;border:none; background-color:transparent; cursor:pointer; display:inline-block;} .ImgBtnFeedbackIconPicture {width:24px; height:24px; background:url(/assets/images/icon_picture_feedback.gif) no-repeat 0px 0px; margin:0; padding:0;border:none; background-color:transparent; cursor:pointer; display:inline-block;} /* SHOPPING BASKET */ .ImgBtnBacketQtyUpdate {width:196px; height:22px; background:url(/assets/images/button_update_qty.gif) no-repeat 0px 0px; margin:0; padding:0;border:none; background-color:transparent; cursor:pointer; display:inline-block;} .ImgBtnBasketBrowse {width:33px; height:25px; background:url(/assets/images/button_browse.gif) no-repeat 0px 0px; margin:0; padding:0;border:none; background-color:transparent; cursor:pointer; display:inline-block;} /* MISC BUTTONS */ .ImgBtnAddNew {width:48px; height:18px; background:url(/assets/images/button_addnew.gif) no-repeat 0px 0px; margin:0; padding:0;border:none; background-color:transparent; cursor:pointer; display:inline-block;} .ImgBtnSubmit {width:108px; height:40px; background:url(/assets/images/button_submit.gif) no-repeat 0px 0px; margin:0; padding:0;border:none; background-color:transparent; cursor:pointer; display:inline-block;} .ImgBtnSubmit:hover {opacity:.8;} .ImgButtonCloseBox {width:101px; height:31px; background:url(/assets/images/button_closebox.gif) no-repeat 0px 0px; margin:0; padding:0;border:none; background-color:transparent; cursor:pointer; display:inline-block;} .ImgBtnFind {width:66px; height:24px; background:url(/assets/images/button_find.gif) no-repeat 0px 0px; margin:0; padding:0;border:none; background-color:transparent; cursor:pointer; display:inline-block;} .ImgBtnForumSearch {width:66px; height:24px; background:url(/assets/images/button_search_forum.gif) no-repeat 0px 0px; margin:0; padding:0;border:none; background-color:transparent; cursor:pointer; display:inline-block;} .ImgBtnTop {width:141px; height:31px; background:url(/assets/images/button_top.gif)no-repeat 0px 0px; margin:20px 0 0 0; padding:0; border:none; background-color:transparent; cursor:pointer; display:inline-block; text-align:center; font-size:13px;} .ImgBtnTop a:link, .ImgBtnTop a:visited {text-decoration:none; color:#fff; display:block; width:141px; height:31px; margin:0; padding-top:7px;} .ImgBtnTop a:hover, .ImgBtnTop a:active {background:url(/assets/images/button_top_on.gif) no-repeat 0px 0px;} /* ======================================================================================== */ /* ======================================================================================== */ /* Navigation */ /* ======================================================================================== */ /* ======================================================================================== */ /* ======================================================================================== */ /* ======================================================================================== */ /* Responsive Layouts */ /* main menu bar */ #nav {margin:10px auto; z-index:10000; height:50px; position:relative;} #nav > a {display:none;} /* Generic */ #nav ul {list-style-type:none; margin:0; padding:0;} #nav li {position:relative; text-align:left;} #nav li a {color:#3d186b; display:block; text-decoration:none; line-height:3.0em; padding:0 0.3em 0 0.8em;} /* First level */ #nav > ul {height:50px;} #nav > ul > li {height:100%; float:left;} #nav > ul > li > a {height:100%; font-size:1.2em; line-height:3em; font-weight:400; padding:0 0.8em 0 0.8em;} #nav > ul > li:not( :last-child ) {} #nav > ul > li.active > a {font-weight:bold;} #nav > ul > li:hover > a {background-color:#ebe6ed; color:#843e98;} #nav > ul > li > a > span:after {/*content:"\25BC"; color:#522e91; position:relative; right:-10px; text-shadow:none; font-size:0.7em;*/} /* ? = ▼ = \25BC || For special chars, convert entity code to CSS hex here: http://www.evotech.net/articles/testjsentities.html */ /* Second level */ #nav > ul > li > ul {width:250px; font-weight:400; background-color:#f1f0f6; display:block; position:absolute; top:100%; overflow:hidden; max-height:0; opacity:0; transition:max-height 1.5s, opacity 0.75s; -webkit-transition:max-height 1.5s, opacity 0.75s;} #nav > ul > li:hover > ul {max-height:800px; opacity:1; overflow:visible;} #nav > ul > li > ul > li > a > span:after {content:'\25BA'; margin-right:0.5em; font-size:0.8em; float:right; color:#522e91;} /* Second and Third levels */ #nav li ul li {font-size:1em; border-bottom:1px solid #c5c5c5;} #nav li ul li a:hover, #nav li ul:not( :hover ) li.active a {background-color:#f0ebf1; color:#843e98;} /* Third level */ #nav > ul > li > ul > li > ul {width:250px; font-weight:400; background-color:#f1f0f6; display:block; position:absolute; top:0; overflow:hidden; left:100%; max-height:0; opacity:0; transition:max-height 1.5s, opacity 0.75s; -webkit-transition:max-height 1.5s, opacity 0.75s; } #nav > ul > li > ul > li:hover > ul {max-height:800px; opacity:1; overflow:visible;} #nav > ul > li > ul > li > ul a {font-size:1em; line-height:2.7em;} #nav ul ul ul li {border-left:1px solid #e3e3e3;} #nav ul ul ul li:first-child {border-top:1px solid #c5c5c5;} @media only screen and ( max-width: 870px) /* 640 */ { /* Menu icon / menu row */ #nav {width:94%; position:relative; margin:5px auto; z-index:10000; background-color:#f0ebf1; border-top:6px solid #fff;} #nav > a {height:50px; position:relative; color:#3d186b;} #nav > a:hover {background-color:#f0ebf1; text-decoration:none; color:#843e98;} #nav:not( :target ) > a:first-of-type, #nav:target > a:last-of-type {display:block;} #nav > ul {height:auto; display:none; position:absolute; left:0; border:0; width:100%;} #nav .menuicon {float:left; font-size:36px; font-weight:bold; margin:16px 10px 0 20px;} #nav .menutext {float:left; font-size:28px; margin-top:16px;} /* Generic */ #nav li {width:100%; border:none; border-bottom:1px solid #c5c5c5; float:none;} #nav li a {line-height:2.7em; padding:0 1.0em 0 0.5em;} /* First level */ #nav:target > ul {display:block;} #nav > ul > li {background-color:#f1f0f6; width:100%; border-right:none;} #nav > ul > li > a {line-height:2.5em;} #nav > ul > li > a > span:after {content:"\25BC"; float:right; font-size:1.2em; text-shadow:none;} /* ? = ▼ = \25BC || For special chars, convert entity code to CSS hex here: http://www.evotech.net/articles/testjsentities.html */ /* Second and Third levels */ #nav ul ul li:last-child {border-bottom:none;} /* Second level */ #nav > ul > li > ul {width:100%; position:static; border:0;} #nav > ul > li > ul > li > a {text-indent:0.8em; font-size:1.2em;} #nav > ul > li > ul > li > a > span:after {content:'\25BC'; margin-right:0.5em; float:right; font-size:1.1em;} /* ? = ▼ = \25BC || For special chars, convert entity code to CSS hex here: http://www.evotech.net/articles/testjsentities.html */ /* Third level */ #nav > ul > li > ul > li > ul {width:100%; position:static;} #nav > ul > li > ul > li:hover > ul {max-height:800px; opacity:1;} #nav ul ul ul li {border-left:none;} #nav ul ul ul li a {text-indent:1.5em;} } /* Second level - Vertical ===================== */ #navSub, #navSub ul {width:100%; list-style:none; line-height:14px; padding:0; margin:0; font-size:13px;} #navSub .sel {background-color:#fff; color:#522e91; background-image:url(/assets/images/arrow_subnav_1_on.png);} #navSub a {display:block; color:#b6a6d2; text-decoration:none;} #navSub li {margin:0px; padding:0px; background:url(/assets/images/arrow_subnav_1.png) 10px 6px no-repeat; list-style:none;} #navSub li a {width:90%; w\idth:85%; padding:8px 5px 5px 36px; background:url(/assets/images/arrow_subnav_1.png) 10px 6px no-repeat;} #navSub li ul {border:0;} #navSub li li .sel {background-color:#fff; color:#3d186b; background-image:url(/assets/images/arrow_subnav_2_on.png);} #navSub li li {margin:0px; padding:0px; background:url(/assets/images/arrow_subnav_2.png) 26px 8px no-repeat;} #navSub li li a {width:90%; w\idth:85%; padding:8px 5px 5px 50px; background:url(/assets/images/arrow_subnav_2.png) 26px 8px no-repeat;} #navSub a:hover {background-color:#fff; color:#843e98;} /* Second level - Horizontal ===================== */ .navSubH {font-size:10px; color:#5d6786; line-height:14px;} .navSubH a:link {color:#5d6786; text-decoration:none;} .navSubH a:visited {color:#666; text-decoration:none;} .navSubH a:active, .navSubH a:hover {color:#f60; text-decoration:underline;} /* Breadcrumbs ===================== */ .MenuBCrumb {font-size:10px; color:#333; font-weight:bold;} .MenuBCrumb a:link, .menuBCrumb a:visited {color:#666; text-decoration:none;} .MenuBCrumb a:active, .menuBCrumb a:hover {color:#a60e0e; text-decoration:underline;} /* Bottom ===================== */ .MenuBotL1 {font-size:10px; color:#000; line-height:14px;} .MenuBotL1 a:link {color:#666; text-decoration:underline;} .MenuBotL1 a:visited {color:#666; text-decoration:underline;} .MenuBotL1 a:active, .MenuBotL1 a:hover {color:#f60; text-decoration:underline;} .MenuBotL1 span {padding:0 5px 0 5px;} .MenuBotL2 {font-size:9px; color:#000; line-height:14px; margin-top:10px;} .MenuBotL2 a:link {color:#666; text-decoration:underline;} .MenuBotL2 a:visited {color:#666; text-decoration:underline;} .MenuBotL2 a:active, .MenuBotL2 a:hover {color:#f60; text-decoration:underline;} .MenuBotL2 span {padding:0 5px 0 5px;} /* ======================================================================================== */ /* ======================================================================================== */ /* ======================================================================================== */ /* ======================================================================================== */ /* Modules - Shared */ /* ======================================================================================== */ /* ======================================================================================== */ /* Home Feature Controls ===================== */ .NewsHomeFeatureHead {padding:5px; background-color:#ccc;} /* usercontrol\front\homepage\News.ascx */ .EventsHomeFeatureHead {padding:5px; background-color:#ccc;} /* usercontrol\front\homepage\Events.ascx */ .CaseStudyFeatureHead {padding:5px; background-color:#ccc;} /* usercontrol\front\homepage\CaseStudy.ascx */ .FriendsPanel {padding:2px;} .FriendsPanelHeader {padding:3px 5px; background-color:#e6e6e6; font-size:11px;} /* Product Listings ===================== */ /*** THIS BLOCK OF CSS NEEDS TO BE FULLY REWORKED - IT WAS COPIED WITHOUT THOUGHT IS IS WAY, WAY, WAY OVER COMPLICATED FOR WHAT IT DOES ***/ .TableHeadProductList {font-size:12px; font-weight:bold; color:#fff; background-color:#666; padding:3px 3px 3px 6px; text-align:left;} #ProductList, #ProductList ul, .ProductList, .ProductList ul {list-style:none; line-height:14px; padding:0; margin:0; background-color:#e5e5e5;} #ProductList .sel, .ProductList .sel {background-color:#fff; background-image:url(/assets/images/arrow_prod_toplevel_on.gif);} #ProductList a, .ProductList a {font-weight:normal; display:block; text-decoration:none; color:#000;} #ProductList li, .ProductList li {margin:0; padding:0; background:url(/assets/images/arrow_prod_toplevel.gif) 3px 6px no-repeat; list-style:none; border-bottom:1px solid #f7f7f7;} #ProductList li a, .ProductList li a {width:146px; width:126px; padding:4px 5px 3px 15px; background:url(/assets/images/arrow_prod_toplevel.gif) 3px 6px no-repeat; color:#878c9c;} #ProductList li ul, .ProductList li ul {border-width:0;} #ProductList li li .sel, .ProductList li li .sel {background-color:#fff; color:#c00; background-image:url(/assets/images/arrow_prod_level2_on.gif);} #ProductList li li, .ProductList li li {margin:0; padding:0; background:url(/assets/images/arrow_prod_level2.gif) 10px 6px no-repeat; background-color:#f7f7f7; border-bottom:1px solid #fff;} #ProductList li li a:hover, .ProductList li li a:hover {color:#c00; background-image:url(/assets/images/arrow_prod_level2_on.gif);} #ProductList li li a, .ProductList li li a {width:146px; width:116px; padding:4px 5px 3px 25px; background:url(/assets/images/arrow_prod_level2.gif) 10px 6px no-repeat;} #ProductList a:hover, .ProductList a:hover {color:#c00; background-image:url(/assets/images/arrow_prod_toplevel_on.gif);} .ProductVariationTable {width:100%; border-top:1px solid #ccc; border-bottom:1px solid #ccc; background-color:#fff;} .ProductVariationTable th {padding:3px 2px; font-size:11px; background-color:#fafafa;} .ProductVariationTable td {padding:3px 2px;} /* Image Album ===================== */ .AlbumImagePopup {background-color:#fff; border-collapse:collapse; margin:0px; padding:0px; width:955px;} .AlbumImagePopupCellHeader {vertical-align:top; font-size:12px; height:40px; background-image:url(/assets/images/tile_stripe.jpg); background-repeat:repeat-x; color:#fff; font-weight:bold;} .AlbumImagePopupCellImage {vertical-align:middle; text-align:center; padding:0px 5px 5px 5px; width:740px;} .AlbumImagePopupCellThumbs {vertical-align:top; text-align:left; width:225px;} .AlbumImageScrollerMainImage {width:100%; text-align:left; padding:10px;} .AlbumImageScrollerThumbnails {width:100%;} .AlbumImageLargeImage {width:700px; height:100%;} .AlbumImageThumbnailImageBorder {margin:0px 5px 5px 0px; width:90px; height:90px;} .AlbumImageThumbnailImageBorder td {border:1px solid #ccc;} .AlbumImageThumbnailImageBorder td:hover, .AlbumImageThumbnailImageBorder .AlbumImageThumbnailSelected {border:2px solid #f60;} .AlbumImageThumbnailImageBorder img {padding-top:3px; margin-left:auto; margin-right:auto;} .AlbumImageFileDescriptionBox {display:none; position:absolute; margin:0px; padding:0px; float:left; border:1px solid #ccc; background-color:#ddd; text-align:left; width:400px;} .AlbumImageFileDescriptionBox p {padding:5px; margin:0px;} /* Image Rotator ===================== */ .RotatorImageList {margin-left:auto; margin-right:auto;} .AlbumImageRotatorImageBorder {margin:0px 5px 5px 0px; width:90px; height:78px;} .AlbumImageRotatorImageBorder td {border:1px solid #ccc;} .AlbumImageRotatorImageBorder td:hover {border:2px solid #f60;} .AlbumImageRotatorImageBorder img {padding-top:3px;} .RadRotator li {list-style:none;} /* Comments ===================== */ .CommentHeader {border-bottom:3px solid #666; color:#000; font-weight:bold; padding:6px 0;} .CommentAvatar, .CommentAvatarAlt {border-bottom:1px solid #808080; padding:5px;} .CommentText, .CommentTextAlt {background-color:#fff; border-bottom:1px solid #808080; color:#000; font-size:12px; padding:10px 5px 8px;} .CommentItemNumber {color:#333; font-size:12px;} .CommentTextUserName {color:#333; font-size:12px; font-weight:bold;} .CommentTextDate {color:#999; font-size:11px;} .CommentTextTime {color:#666; font-size:11px;} /* Ratings ===================== */ .filledRatingStar {background-image:url(/assets/images/FilledStar.png);} .ratingStar {background-repeat:no-repeat; cursor:pointer; display:block; font-size:0; height:12px; margin:0; padding:0; width:13px;} .emptyRatingStar {background-image:url(/assets/images/EmptyStar.png);} .savedRatingStar {background-image:url(/assets/images/SavedStar.png);} /* Feedback ===================== */ .FeedbackTable {width:850px;} .feedbackPosition {position:fixed; top:40px; right:0px;} /* Shop - Shared ===================== */ /*----------------------------------------------*/ /* Grid Layout - Responsive Columns */ /*Generic handling to make the active area the same size as the contained DIV */ .PanelItemGrid {padding:0 5px;} .PanelItemGrid > article {float:left; background-color:#fff;} .PanelItemGrid > article > a {display:block; width:100%; text-decoration:none;} /*Custom size handling for each column variant */ .PanelItemGrid3Col > article {width:31%; min-width:160px; margin:5px 1% 20px 1%;} .PanelItemGrid3ColNarrow > article {width:31%; min-width:160px; margin:5px 1% 20px 1%;} .PanelItemGrid3ColDownloads > article {width:31%; min-width:180px; margin:5px 1% 20px 1%;} .PanelItemGrid3ColVideo > article {width:31%; min-width:300px; margin:5px 1% 20px 1%;} .PanelItemGrid4Col > article {width:23%; min-width:170px; margin:5px 1% 20px 1%;} .PanelItemGrid4ColProds > article {width:23%; min-width:230px; margin:5px 1% 20px 1%;} .PanelItemGrid4ColImages > article {width:23%; min-width:200px; margin:5px 1% 20px 1%; position:relative;} /*Set the heights by Grid type (move generic handling from the next CSS block up into here if needed)*/ .PanelItemGrid3Col > article > a > div {height:260px;} .PanelItemGrid3ColNarrow > article > a > div {height:260px;} .PanelItemGrid3ColDownloads > article > a > div {height:380px;} .PanelItemGrid3ColVideo > article > a > div {height:350px;} .PanelItemGrid4Col > article > a > div {height:300px;} .PanelItemGrid4ColProds > article > a > div {height:360px;} .PanelItemGrid4ColImages > article > a > div {height:180px;} /*Generic handing to set the primary container size, and ensure the active area is the same size and support the image resize effect*/ .PanelItemGrid > article > a > div {border:1px solid #e1e1e1; padding:0 5%; overflow:hidden; box-shadow:0 0 3px 3px #e3e3e3;} .PanelItemGrid > article > a > div:hover {border:1px solid #b7b7b7; box-shadow:0 0 3px 3px #cacaca;} /*Animate the Image*/ .PanelItemGrid4ColProds > article > a > div > div:last-child img {max-height:180px; max-width:170px;} .PanelItemGrid > article > a > div > div:last-child img {-webkit-transition:-webkit-transform 1s; transition: transform 1s;} .PanelItemGrid > article > a > div:hover > div:last-child img {transform:scale(0.9,0.9); -webkit-transform: scale(0.9,0.9);} /*Image Gallery Custom*/ .PanelItemGrid4ColImages {margin-top:20px;} .PanelItemGrid4ColImages > article > a > div {padding:0; border:1px solid #e1e1e1; box-shadow:none; background-color:#fcfcfc;} .PanelItemGrid4ColImages > article > a > div:hover {border:1px solid #b7b7b7; box-shadow:none;} .PanelItemGrid4ColImages > article > a > div > img {margin:0 auto; height:100%; width:auto; max-width:480px;} .PanelItemGrid4ColImages > article .ImgInfo {z-index:51; overflow:hidden; background-color:#2b2b2b; color:#fff; opacity:0.9; position:absolute; top:180px; height:0; width:100%; -webkit-transition:-webkit-transform 0s, height 0.7s; transition: transform 0s, height 0.7s;} .PanelItemGrid4ColImages > article:hover .ImgInfo{transform:translate(0,0); -webkit-transform: translate(0,0); height:110px; border-bottom:2px solid #eee;} .PanelItemGrid4ColImages .ImgTitle {font-size:13px; text-align:center;} .PanelItemGrid4ColImages .ImgDesc {text-align:left; padding:5px 0px 0px 5px; font-size:12px; line-height:14px;} .PanelItemGrid4ColImages .ImgRelatedProducts {text-align:left; padding:5px 0px 0px 5px; font-size:12px; line-height:14px;} /*Generic handling to deal with the content of each panel*/ .PanelItemGrid > article > a > div > div {margin:15px auto; text-align:center;} .PanelItemGrid > article > a > div > div h2 {font-size:16px !important; line-height:18px; color:#000; margin:20px 0 5px 0;} .PanelItemGrid > article > a > div > div p {font-size:13px !important; line-height:16px; color:#333; margin:0;} .PanelItemGrid > article > a > div > div p:hover {cursor:pointer;} .PanelItemGrid > article > a > div > div img {margin:5px auto; z-index:50; position:relative;} /*Layer in special markers*/ .PanelItemGrid aside:nth-of-type(1) {position:absolute; z-index:150;} .PanelItemGrid aside:nth-of-type(1) > img {margin:5px 0;} /*Layer in add to basket to list control*/ .PanelItemGrid aside:nth-of-type(2) {position:absolute; z-index:150;} .PanelItemGrid aside:nth-of-type(2) > a {margin:300px 0;} /* MAKE LAYOUT SHUFFLE at 900px */ @media only screen and (max-width: 1000px) { /*.PanelItemGrid4Col > article, .PanelItemGrid4ColProds > article, .PanelItemGrid4ColImages > article {width:31%; margin:0 1% 14px 1%;}*/ } /* MAKE LAYOUT SHUFFLE at 768px */ @media only screen and (max-width: 768px) { .PanelItemGrid3Col > article, .PanelItemGrid3ColNarrow > article, .PanelItemGrid3ColDownloads > article, .PanelItemGrid3ColVideo > article, .PanelItemGrid4Col > article, .PanelItemGrid4ColProds > article, .PanelItemGrid4ColImages > article {width:48%; margin:0 1% 14px 1%;} } /* MAKE LAYOUT SHUFFLE at 480px*/ @media only screen and (max-width: 480px) { .PanelItemGrid3Col > article, .PanelItemGrid3ColNarrow > article, .PanelItemGrid3ColVideo > article, .PanelItemGrid3ColDownloads > article .PanelItemGrid4Col > article, .PanelItemGrid4ColProds > article, .PanelItemGrid4ColImages > article {width:98% !important; margin:15px auto !important;} .PanelItemGrid > article > a > div {height:auto;} .PanelItemGrid4ColImages > article .ImgInfo {top:100%;} } /* Animation ===================== */ /* Login Dashboard - usercontrol\front\customer\cust_login_dashboard.ascx ===================== */ .LoginField {padding:3px; width:120px; background-color:#f4f4f4; border:2px solid #069;} .ProfileBoxTable {width:160px; border:0; color:#666; font-size:11px;} .ProfileInnerTable {width:130px; margin-left:auto; margin-right:auto; border:0;} .ProfileBoxTile {background-image:url(/assets/images/profile_box_tile.gif); background-repeat:repeat-y; background-color:#fff; padding-left:4px; padding-right:3px;} .ProfileCountColumn {color:#666; font-size:10px; text-align:right; padding-right:3px;} .ProfileIcon {padding:4px 8px 4px 8px; text-align:center;} .LoginPanelProfile {z-index:1000; position:absolute; right:10px; top:35px; background-color:#ddcde5; width:250px;} .LoginPanelProfile a:link, .LoginPanelProfile a:visited {color:#69646c;} .LoginPanelProfile a:hover, .LoginPanelProfile a:active {color:#ff8c0a;} .LoginPanelProfileHeader {color:#fff; background:url(../images/profile_backdrop.jpg) no-repeat; padding:8px 12px; font-size:12px; font-weight:bold;} .LoginPanelProfileSelect {font-size:12px; padding:3px 10px;} .LoginPanelCancel {background-color:#fff; font-size:11px; text-align:center; padding:2px 8px; margin:0 10px 6px 0;} a.LoginPanelCancel:link, a.LoginPanelCancel:visited {text-decoration:none;} a.LoginPanelCancel:hover, a.LoginPanelCancel:active {color:#fff; background-color:#7b5c98;} /* CRM Chat ===================== */ .CRMChatPanel {margin-top:20px; padding-bottom:10px;} .CRMChatBorder {border:1px solid #999;} .CRMChat_Item {clear:both; padding:8px;} .CRMChat_Right {Width:600px; border-radius:8px; float:right; border:1px solid #aaa; background-color:#d4f7d2; padding:3px 6px;} .CRMChat_Left {Width:600px; border-radius:8px; float:left; border:1px solid #aaa; background-color:#f4f4f4; padding:3px 6px;} .CRMChat_FileNote {Width:600px; border-radius:8px; float:left; border:1px solid #aaa; background-color:#ffea00; padding:3px 6px;} .CRMComm_Left_NotRead {width:32px; height:32px; float:left; } .CRMComm_Right_NotRead {width:32px; height:32px; float:right; } .CRMChat_ItemDateTime {text-align:right; color:#999; font-size:10px; } .ChatContainer {background-color:#fff; padding:10px;} .ChatBoxPanel {width:100%;} .ChatBoxPanelInput {border:1px solid #999; background-color:#fff; padding:2px; overflow:hidden;} .ChatBoxPanelInput .reWrapper {border:0 !important;} .ChatBox {} .ChatHeaderNote {border:2px solid #ccc; padding:0 10px 0 10px; margin:10px 0 15px 0;} .ChatBoxButton {float:right; padding:10px 150px 5px 0;} .CRMChat_AttachedFile {Margin-top:5px;} .CRMComm_ChatSubject {color:#888; display:block;} /* ======================================================================================== */ /* ======================================================================================== */ /* Static */ /* ======================================================================================== */ /* ======================================================================================== */ .nobr {display:inline; white-space:nowrap;} .BackgroundWhite {background-color:#fff;} .BackgroundGrey {background-color:#ccc;} .DisplayBlock {display:block;} .FloatLeft {float:left;} .FloatRight {float:right; overflow:hidden;} .OverflowHidden {overflow:hidden;} .AlignLeft {text-align:left;} .AlignRight {text-align:right;} .AlignCenter {text-align:center;} .AlignTop {vertical-align:top;} .AlignBottom {vertical-align:bottom;} .AlignCenterImage {margin-left:auto; margin-right:auto;} .AlignCenterObject {margin-left:auto; margin-right:auto;} .AlignLeftImage {float:left;} .AlignRightImage {float:right;} .AlignVertMiddle {vertical-align:middle;} .Padding2 {padding:2px;} .Padding3 {padding:3px;} .Padding4 {padding:4px;} .Padding5 {padding:5px;} .Padding10 {padding:10px;} .Padding20 {padding:20px;} .Padding25 {padding:25px;} .Padding30 {padding:30px;} .PaddingBottom6 {padding-bottom:6px;} .PaddingBottom10 {padding-bottom:10px;} .PaddingBottom20 {padding-bottom:20px;} .PaddingTop5 {padding-top:5px;} .PaddingTop6 {padding-top:6px;} .PaddingTop8 {padding-top:8px;} .PaddingTop20 {padding-top:20px;} .PaddingTopBot2 {padding:2px 0;} .PaddingRight2 {padding-right:2px} .PaddingRight3 {padding-right:3px} .PaddingRight5 {padding-right:5px} .PaddingRight10 {padding-right:10px} .PaddingRight15 {padding-right:15px} .PaddingLeft10 {padding-left:10px;} .PaddingLeft20 {padding-left:20px;} .PaddingLeft50 {padding-left:50px;} .PaddingLeft100 {padding-left:100px;} .Margin5 {margin:5px;} .Margin10 {margin:10px;} .Margin20 {margin:20px;} .MarginTop3 {margin-top:3px;} .MarginTop5 {margin-top:5px;} .MarginTop10 {margin-top:10px;} .MarginTop20 {margin-top:20px;} .MarginTopBot2 {margin-top:2px; margin-bottom:2px;} .MarginLeft5 {margin-left:5px;} .MarginLeft7 {margin-left:7px;} .MarginLeft12 {margin-left:12px;} .MarginLeft20 {margin-left:20px;} .MarginBottom3 {margin-bottom:3px;} .MarginBottom5 {margin-bottom:5px;} .MarginBottom7 {margin-bottom:7px;} .MarginBottom20 {margin-bottom:20px;} .MarginRight6 {margin-right:6px;} .MarginRight20 {margin-right:20px;} .Border1Purple {border:1px solid #e9dcf2;} .Border1Grey {border:1px solid #ccc;} .Border3White {border:3px solid #fff;} .BorderRightGrey {border-right:1px solid #ccc;} .BorderLeftGrey {border-left:1px solid #ccc;} .BorderTopGrey {border-top:1px solid #ccc;} .BorderBottomGrey {border-bottom:1px solid #ccc;} .BorderTop3 {border-top:3px solid #e2dbe6;} .BorderBottom3 {border-bottom:3px solid #e2dbe6;} .DividerLine {margin:10px 0; background-color:#ccc; height:4px;} .Border3Grey {border:3px solid #e2dbe6;} .BackgroundHighlight {background-color:#f7f8fd;} /* % WIDTH SETTINGS ===================== */ .Width1 {width:1%;} .Width2 {width:2%;} .Width3 {width:3%;} .Width4 {width:4%;} .Width5 {width:5%;} .Width6 {width:6%;} .Width7 {width:7%;} .Width8 {width:8%;} .Width9 {width:9%;} .Width10 {width:10%;} .Width12 {width:12%;} .Width15 {width:15%;} .Width17 {width:17%;} .Width19 {width:19%;} .Width20 {width:20%;} .Width25 {width:25%;} .Width30 {width:30%;} .Width35 {width:35%;} .Width40 {width:40%;} .Width45 {width:45%;} .Width50 {width:50%;} .Width55 {width:55%;} .Width60 {width:60%;} .Width65 {width:65%;} .Width70 {width:70%;} .Width75 {width:75%;} .Width80 {width:80%;} .Width85 {width:85%;} .Width90 {width:90%;} .Width95 {width:95%;} .Width96 {width:96%;} .Width97 {width:97%;} .Width98 {width:98%;} .Width99 {width:99%;} .Width100 {width:100%;} /* IMAGE SIZES ===================== */ .ImageBasic {border:0px;} .ImageBorderWhite1 {border:1px solid #fff;} .ImageBorderWhite2 {border:2px solid #fff;} .ImageBorderWhite3 {border:3px solid #fff;} .ImageBorderWhite10 {border:10px solid #fff;} .ImageBorderGrey1 {border:1px solid #ccc;} /* Used for square images */ .Image16 {width:16px; height:16px;} .Image18 {width:18px; height:18px;} .Image24 {width:24px; height:24px;} .Image32 {width:32px; height:32px;} .Image40 {width:40px; height:40px;} .Image48 {width:48px; height:48px;} .Image72 {width:72px; height:72px;} .Image128 {width:128px; height:128px;} .Image256 {width:256px; height:256px;} /* COLORS ===================== */ .Red {color:#f00;} .Green {color:#093;} .Black {color:#000;} .White {color:#fff;} /* ======================================================================================== */ /* ======================================================================================== */ /* Custom */ /* ======================================================================================== */ /* ======================================================================================== */ .LoginBox {padding:8px 12px; background-image:url(/assets/images/white_40.png); float:right; min-width:70px; color:#fff; text-align:center; font-size:13px;} .LoginBox a:link, .LoginBox a:visited {color:#fff; text-decoration:none;} .LoginBox a:hover, .LoginBox a:active {color:#fff; text-decoration:underline;} .ChangeButton {border:1px solid #8d7ece; padding:5px 8px 5px 18px; margin-right:8px; margin-left:6px; background:url(/assets/images/arrow_change.png) #4b405a no-repeat 3px 6px; border-radius:3px;} .ChangeButton a:link, .ChangeButton a:visited {text-decoration:none; color:#fff;} .ChangeButton a:hover, .ChangeButton a:active {text-decoration:underline; color:#8d7ece;} /* Homepage */ .HomeLogo {margin-top:195px;} .HomeMainSections {width:722px; height:301px; margin-top:28px; padding:0; background:url(/assets/images/home_selector_background.jpg) no-repeat top left;} .HomeSelectBox {background-image:url(/assets/images/white_40.png); width:236px; height:147px; float:left; padding:0;} .HomeSelectBoxText {font-size:13px; line-height:15px; width:224px; float:left;} .HomeSelectBoxText p {margin-top:15px; padding-left:14px;} .HomeSelectBoxHeader {background-image:url(/assets/images/white_40.png); color:#522e91; font-size:14px; padding:10px 5px 10px 17px; width:196px; font-weight:bold;} .HomeSelectBox:hover {background-image:url(/assets/images/white_60.png);} .HomeMainSections a:link, .HomeMainSections a:visited {text-decoration:none;} .HomeMainSections a:hover, .HomeMainSections a:active {text-decoration:none;} .BoxLink a:link, .BoxLink a:visited {color:#fff; text-decoration:underline; display:block;} .BoxLink a:hover, .BoxLink a:active {color:#fff; text-decoration:underline;} .SocialIcon {float:left; margin:10px 6px 10px 20px;} .SocialIcon2 {float:left; margin:10px 6px;} /* Nice Bullet Lists */ ul.marked_list1 {margin:10px 0 0 25px; padding:0; list-style:none;} ul.marked_list1 li {padding:0 0 8px 16px; line-height:16px; font-size:14px; background:url(/assets/images/marker1.png) no-repeat 0 6px; margin:0; color:#333;} ul.marked_list1 li a {line-height:16px; color:#333; text-decoration:underline;} ul.marked_list1 li a:hover {line-height:16px; color:#522e91; text-decoration:underline;} /* Nice Data Displayed in Tables */ .TableData {background-color:#e8e6eb; color:#522e91; margin-bottom:28px;} .TableData th {background-color:#e2dbe6; color:#522e91; padding:10px; font-size:15px; text-align:left;} .TableData td {border-bottom:1px dotted #fff; padding:6px 8px;} .TableDataSmallText {font-size:12px; line-height:14px;} .TableDataCourses {background-color:#e8e6eb; color:#522e91; margin-bottom:28px;} .TableDataCourses th {background-color:#873e98; color:#fff; padding:10px; font-size:15px; text-align:left;} .TableDataCourses td {border-bottom:1px dotted #fff; padding:6px 8px;} .TableDataCoursesSubHead {background-color:#e0d9e5; font-size:16px;} .TableDataCoursesSmallText {font-size:12px; line-height:14px;} .TableInfoHeader {background-color:#e0d9e5; font-size:18px; color:#522e91; padding:12px 18px;} .TableAddAttendees {background-color:#f7f8fd;} .TableAddAttendees caption {text-align:left; padding-left:5px; font-size:12px; font-style:italic;} /* Dashboard */ .HeaderInfo {background-color:#7b5c98; color:#fff; padding:10px 15px;} .DashboardPanel {background-color:#fff; padding:10px; border:1px solid #e2dbe6;} .TextInfoStd {color:#522e91; font-size:13px; line-height:16px;} .DashboardProfileBox {width:775px; margin:20px 0 20px 0;} .DashboardProfile {background:url(../images/profile_backdrop.jpg) no-repeat; height:145px; width:636px; overflow:hidden; padding:0 0 0 26px; color:#fff; text-align:top; text-align:left; vertical-align:middle;} .DashboardAvatar {width:140px; background:url(/assets/images/noimage128.jpg)#fff no-repeat center;} .DashboardProfileName {font-size:20px; color:#fff;} .BarChart {padding:10px 0;} .PieChart {padding:10px 0;} .WorkshopDate {font-style:italic; color:#522e91; line-height:18px;} .WorkshopName {color:#522e91; font-weight:bold; font-size:14px; line-height:22px;} .WorkshopShortDesc {color:#522e91; font-size:12px; line-height:18px;} .WorkshopAttending {width:100px; float:right; padding:8px 12px; color:#522e91; font-size:12px; font-weight:bold; background-color:#c5bcd6; text-align:center;} .WorkshopAttending a:link, .WorkshopAttending a:visited {color:#522e91; text-decoration:none;} .WorkshopAttending a:hover, .WorkshopAttending a:active {color:#333; text-decoration:underline;} .WorkshopClickAttend {width:100px; float:right; padding:8px 12px; color:#d80114; font-size:12px; font-weight:bold; background-color:#eaafb4; text-align:center;} .WorkshopAttending a:link, .WorkshopAttending a:visited {color:#d80114; text-decoration:none;} .WorkshopAttending a:hover, .WorkshopAttending a:active {color:#333; text-decoration:underline;} .SideText {padding:3px 0 5px 7px; color:#522e91; font-size:13px; line-height:18px;} .SideText a:link, .SideText a:visited {color:#522e91; text-decoration:underline;} .SideText a:hover, .SideText a:active {color:#522e91; text-decoration:underline;} .SideChatDate {font-style:italic; color:#522e91;} /* Courses & Workshops */ .CoursePanel {color:#522e91; font-size:14px; margin-bottom:25px;} /*.CoursePanel h1 {font-size:18px; margin:0; font-weight:normal;}*/ .CoursePanel p {margin-top:5px; margin-bottom:8px;} .CoursePanel a:link, .CoursePanel a:visited {color:#522e91; text-decoration:none;} .CoursePanel a:hover, .CoursePanel a:active {color:#522e91; text-decoration:underline;} /* Course Detail */ .CoursePanelDetail {color: #522e91;font-size:14px; margin-bottom:25px;} /*.CoursePanelDetail h1 {font-size:22px !important; line-height:28px; margin:0; font-weight:normal !important;}*/ .CoursePanelDetail h2 {font-size:20px !important; line-height:26px; margin:0; font-weight:normal;} .CoursePanelDetail h3 {font-size:18px !important; line-height:24px; margin:0; font-weight:normal;} .CoursePanelDetail p {margin-top:5px; margin-bottom:8px;} .CoursePanelDetail a:link, .CoursePanelDetail a:visited {color:#522e91; text-decoration:none;} .CoursePanelDetail a:hover, .CoursePanelDetail a:active {color:#522e91; text-decoration:underline;} .CourseHeader {} .CourseListOverview {background-color:#e8e6eb;} .CourseMainComponents {border:3px solid #cbcbcb; padding:10px 10px; background-color:#f8f4de;} .CourseGroupings {border:2px solid #e3e0e6; background-color:#fafafa; padding:20px;} .CourseType1 {background-color:#d80114; width:14px; height:14px; float:left; margin:5px 5px 5px 0;} .CourseType2 {background-color:#ea9427; width:14px; height:14px; float:left; margin:5px 5px 5px 0;} .CourseType3 {background-color:#5e0454; width:14px; height:14px; float:left; margin:5px 5px 5px 0;} .CourseType1Sml {background-color:#d80114; width:10px; height:10px; float:left; margin:5px 5px 5px 0;} .CourseType2Sml {background-color:#ea9427; width:10px; height:10px; float:left; margin:5px 5px 5px 0;} .CourseType3Sml {background-color:#5e0454; width:10px; height:10px; float:left; margin:5px 5px 5px 0;} .CoursePurchaseInfo {width:180px; padding:10px 0 20px 5px;} .BookitButton {width:120px; padding:16px 20px; color:#522e91; font-size:14px; font-weight:bold; background-color:#c5bcd6; text-align:center;} .HeadLearningSet {border-bottom:3px solid #ccc; color:#522e91; font-size:18px; font-style:italic; font-weight:bold; margin-bottom:25px;} ul.marked_list2 {margin:10px 0 10px 25px; padding:16px 10px 16px 20px; list-style:none; border-left:4px solid #e2dbe6; background-color:#eae8ec; width:80%;} ul.marked_list2 li {padding:0 0 8px 16px; line-height:16px; font-size:14px; background:url(/assets/images/marker2.png) no-repeat 0 6px; margin:0; color:#333;} ul.marked_list2 li a {line-height:16px; color:#333; text-decoration:underline;} ul.marked_list2 li a:hover {line-height:16px; color:#522e91; text-decoration:underline;} /* Orange Buttons */ .ButtonOrange {background-color:#ff9c2b; text-align:center; padding:3px 15px 3px 15px; margin:0 6px 0 6px; border-radius:3px; white-space:nowrap;} a.ButtonOrange:link, a.ButtonOrange:visited {color:#fff; text-decoration:none;} a.ButtonOrange:hover, a.ButtonOrange:active {background-color:#ffae52;} .ButtonOrangeLge {background-color:#ff9c2b; text-align:center; padding:4px 20px 4px 20px; margin:0 6px 0 6px; border-radius:4px; font-size:16px; white-space:nowrap;} a.ButtonOrangeLge:link, a.ButtonOrangeLge:visited {color:#fff; text-decoration:none;} a.ButtonOrangeLge:hover, a.ButtonOrangeLge:active {background-color:#ffae52;} .OrangeButton {margin-bottom:20px;} .OrangeButton ul {list-style-type:none; margin:0; padding:0; overflow:hidden;} .OrangeButton li {float:left;} .OrangeButton a:link, .OrangeButton a:visited {display:block; width:150px; color:#fff; background-color:#eba954; text-align:center; padding:4px; text-decoration:none; margin-right:6px;} .OrangeButton a:hover, .OrangeButton a:active {background-color:#ea9427;} .OrangeButtonOn ul {list-style-type:none; margin:0; padding:0; overflow:hidden;} .OrangeButtonOn li {float:left;} .OrangeButtonOn {display:block; width:150px; color:#fff; background-color:#ea9427; text-align:center; padding:4px; text-decoration:none; margin-right:6px;} .OrangeButtonLge {margin-bottom:20px;} .OrangeButtonLge ul {list-style-type:none; margin:0; padding:0; overflow:hidden;} .OrangeButtonLge li {float:left;} .OrangeButtonLge a:link, .OrangeButtonLge a:visited {display:block; width:280px; color:#fff; background-color:#eba954; text-align:center; padding:14px; text-decoration:none; margin-right:6px; margin-left:20px;} .OrangeButtonLge a:hover, .OrangeButtonLge a:active {background-color:#ea9427;} /* Text Buttons (hover text and see a button) */ .BtnTextHover {border:1px solid transparent; padding:3px; display:inline-block;} a.BtnTextHover:link, a.BtnTextHover:visited {color:#522e91; text-decoration:none; } a.BtnTextHover:hover, a.BtnTextHover:active {color:#522e91; text-decoration:none; border:1px solid #522e91; border-radius:3px; background-color:#fff;} /* Page Bottom Feature */ .PageFeature {width:768px; margin-top:28px; padding:0; background:url(/assets/images/tile_page_feature.jpg) no-repeat top left;} .PageFeatureBox {background-image:url(/assets/images/white_40.png); width:248px; height:190px; float:left; padding:0;} .PageFeatureBoxText {font-size:13px; line-height:15px; width:234px; float:left;} .PageFeatureBoxText p {margin-top:15px; color:#fff; padding-left:14px;} .PageFeatureBoxHeader {background-image:url(/assets/images/white_40.png); color:#522e91; font-size:14px; padding:10px 18px; width:182px;} .PageFeatureBox:hover {background-image:url(/assets/images/white_60.png);} .PageFeature a:link, .PageFeature a:visited {text-decoration:none;} .PageFeature a:hover, .PageFeature a:active {text-decoration:none;} /* CPD */ .SearchCDPHistory {width:80%; background-color:#e2dbe6; padding:10px;} /* Form override handling */ .RadioCheckbox {display: inline-block; margin-left:5px} .RadioCheckbox td {margin-left:0px; padding-left:0;} .RadioCheckbox input {margin-bottom: 5px !important;} .RadioCheckbox label {display: inline-block; margin: 0 15px 0 5px} /* Prompt Message Handling - Online Learning Module Tutorials */ .PromptBox {width:90%; margin:25px 0 25px 20px; padding:0; overflow:hidden;} .PromptBoxInner {padding:10px 10px 10px 70px; overflow:hidden; z-index:9999;} .PromptBoxText {margin:0 10px 5px 0; font-size:1.1em; color:#333;} .PromptBoxKeyConcept {background-color:#c8bcd1;} .PromptBoxInnerKeyConcept {background-image:url('/ImagesCust/imagescont/icons/icon_key_concept.png'); background-repeat:no-repeat; background-position:5px 10px;} .PromptBoxExample {background-color:#b5b4e0;} .PromptBoxInnerExample {background-image:url('/ImagesCust/imagescont/icons/icon_example.png'); background-repeat:no-repeat; background-position:5px 10px;} .PromptBoxCaseStudy {background-color:#c8bcd1;} .PromptBoxInnerCaseStudy {background-image:url('/ImagesCust/imagescont/icons/icon_case_studies.png'); background-repeat:no-repeat; background-position:5px 10px;} .PromptBoxResources {background-color:#b5b4e0;} .PromptBoxInnerResources {background-image:url('/ImagesCust/imagescont/icons/icon_resources.png'); background-repeat:no-repeat; background-position:5px 10px;} .PromptBoxTest {background-color:#c8bcd1;} .PromptBoxInnerTest {background-image:url('/ImagesCust/imagescont/icons/icon_test_yourself.png'); background-repeat:no-repeat; background-position:5px 10px;} /* Image Size Hover */ .ImageSizeHover img {display:block; max-width:400px; max-height:150px; width:auto; height:auto; -webkit-transition-property: width 1s, height 1s, -webkit-transform 1s; transition-property: width 1s, height 1s, transform 1s;} .ImageSizeHover img:hover {max-width:550px; max-height:800px; cursor:zoom-in;} .SponsorSide {width:90%; margin-top:20px; margin-left:auto; margin-right:auto; margin-bottom:15px; font-size:10px; line-height:13px !important; text-align:center;} /* Nice Data Displayed in Tables */ .TableData {background-color:#e8e6eb; color:#522e91; margin-bottom:28px;} .TableData th {background-color:#e2dbe6; color:#522e91; padding:10px; font-size:15px; text-align:left;} .TableData td {border-bottom:1px dotted #fff; padding:6px 8px;} .TableDataSmallText {font-size:12px; line-height:14px;} .TableDataCourses {background-color:#e8e6eb; color:#522e91; margin-bottom:28px;} .TableDataCourses th {background-color:#873e98; color:#fff; padding:10px; font-size:15px; text-align:left;} .TableDataCourses td {border-bottom:1px dotted #fff; padding:6px 8px;} .TableDataCoursesSubHead {background-color:#e0d9e5; font-size:16px;} .TableDataCoursesSmallText {font-size:12px; line-height:14px;} /* "My Qualification Plan." */ .MyQualPlan h2 {padding-top:30px; margin-top:30px;} .MyQualPlan h2:first-of-type {padding-top:0;} .TableDataMyQuals {background-color:#f1f0f3; color:#522e91; font-size:12px; width:100%; margin:20px 0 0 0; border:1px solid #ccc;} .TableDataMyQuals th {background-color:#873e98; color:#fff; padding:8px 5px 5px 5px; font-size:14px; text-align:left;} .TableDataMyQuals td {padding:2px 8px; color:#666; margin:0; line-height:normal;} .TableDataMyQuals tr:first-of-type td {font-size:12px; padding-top:10px;} .TableDataMyQuals tr:last-of-type td {padding-bottom:10px !important; border-bottom:1px solid #ccc;} .TableDataMyQualsSubHead {font-size:14px; font-weight:600; color:#522e91 !important; padding:8px 5px 3px 5px !important;} .IndicateStatusStart {background-color:#fae8d7;} .TableDataMyQuals .TableDataMyQualsModule, .TableDataMyQuals .IndicateStatusStart {border-bottom:1px solid transparent;} .TableDataMyQuals .TableDataMyQualsModule:hover, .TableDataMyQuals .IndicateStatusStart:hover {background-color:#f9f9f9; border-bottom:1px solid #ccc;} .TableDataMyQualsModule td:first-of-type, .IndicateStatusStart td:first-of-type {padding:0; color:#666;} /*Put zero padding on the first TD so the hover is hot in the entire cell. The contained element then has padding applied to position the text.*/ .LearnModName {min-height:28px; line-height:28px;} .LearnModName > a {display:block; line-height:28px; border:1px solid transparent;} .LearnModName > a > span, .LearnModName > span {display: inline-block; vertical-align: middle; line-height: normal; padding:4px 8px; margin-right:20px;} /* Handling to get the vertical align working nicely, done in combination with the above 2 lines. */ .LearnModName > a:link, .LearnModName > a:visited {text-decoration:none; } .LearnModName > a:hover, .LearnModName > a:active {color:#522e91; text-decoration:none; border:1px solid #522e91; border-radius:3px; background-color:#fff;} .LearnModName > span {color:#999;} /*Make the items that are not yet bought/assigned show in a greyed out colour. */ .LearnModDateHistory {font-weight:normal;color:#000;} .LearnModDatePlan {font-weight:normal;color:#999;} /* Status Icon */ .StatusIcon {background-color:transparent; display:block; height:16px; margin:0; padding:1px 4px; border-radius:3px; border-color:transparent; border:1px solid #ccc;} .StatusIcon:hover {background-color:#fafafa; /* border-color:#666 !important; */} /* Grade */ .GradeLink {border-radius:3px; padding:3px 3px; font-size:9px; line-height:14px; letter-spacing:2px; display:block; text-align:center;} a.GradeLink:link, a.GradeLink:visited {text-decoration:none !important;} a.GradeLink:hover, a.GradeLink:active {text-decoration:none !important; color:#fff;} .GradeNYC {background-color:#ccc;} .GradeCOM {background-color:#6C6;} .LearnQualCreditsReq {border:1px solid #ccc; padding:8px; background-color:#f1f0f3;} .LearnQualStatusDates {border:1px solid #ccc; padding:8px; background-color:#f1f0f3;} .LearnQualPlanKey {border:1px solid #ccc; padding:8px; margin:40px 0 0 0; background-color:#f1f0f3;} /* New Stuff */ .FooterHR {visibility:hidden;} .HomepageFeature {background-color:#ebe6ed; margin:14px auto;} .HomepageFeature:hover {background-color:#f4f1f5; -webkit-box-shadow:0 0 5px 5px rgba(76, 76, 76, 0.1); -moz-box-shadow:0 0 5px 5px rgba(76, 76, 76, 0.1); box-shadow:0 0 5px 5px rgba(76, 76, 76, 0.1);} .HomepageFeatureHead {background-color:#843e98; padding:8px 20px;} .HomepageFeatureHead:hover {/*background-color:#b990c4;*/} .HomepageFeatureHead h3 {color:#fff; font-size:16px; margin:0;} .HomepageFeatureText {margin:18px;} .HomepageFeatureText p {padding-bottom:10px;} .HomepageFeatureBase {background-color:#ddd6e0; text-align:center; padding:10px 2px;} .HomepageFeatureBase:hover {background-color:#b990c4; text-decoration:none;} .HomepageFeature a:link, .HomepageFeature a:visited {text-decoration:none !important; color:#000 !important;} .HomepageFeature a:hover, .HomepageFeature a:active {text-decoration:none !important; cursor:pointer;} .HomepageFeatureButton {border:0; border-radius:16px; width:85%; color:#843e98; text-align:center; text-decoration:none; background-color:#fff; padding:8px 0; margin:2px auto; font-size:14px; font-weight:normal; line-height:1em;} .HomepageFeatureButton a:link, .HomepageFeatureButton a:visited {text-decoration:none;} .HomepageFeatureButton a:hover , .HomepageFeatureButton a:active {} /* ======================================================================================== */ /* ======================================================================================== */ /* Responsive Layouts */ /* ======================================================================================== */ /* ======================================================================================== */ /* For Help with the responsive grid system, follow the link below */ /* http://www.responsivegridsystem.com */ /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ /* Custom */ /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ /* Apply this style directly within an 'img' tag to create images that automatically resize as the parent space shrinks */ .responsive-image img {height:auto !important; max-width:100% !important; width:100% !important;} /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ /* Column system */ /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ /* GRID COLUMN SETUP ==================================================================== */ .col {display:block; float:left; margin:1% 0 1% 1.6%;} .col:first-child {margin-left:0; } .colMargin_0 {display:block; float:left; margin:0;} /* Tight Columns */ .colMargin_0:first-child {margin-left:0; } /* GRID OF TWO ============================================================================= */ .span_2_of_2 {width:100%;} .span_1_of_2 {width:49.2%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width: 480px) { .span_2_of_2 {width:100%;} .span_1_of_2 {width:100%;} } /* GRID OF THREE ============================================================================= */ .span_3_of_3 {width:100%;} .span_2_of_3 {width:66.13%;} .span_1_of_3 {width:32.26%;} /* GO FULL WIDTH AT LESS THAN 768 PIXELS */ @media only screen and (max-width: 480px) { .span_3_of_3 {width:100%;} .span_2_of_3 {width:100%;} .span_1_of_3 {width:100%;} } /* GRID OF FOUR ============================================================================= */ .span_4_of_4 {width:100%;} .span_3_of_4 {width:74.6%;} .span_2_of_4 {width:49.2%;} .span_1_of_4 {width:23.8%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width: 480px) { .span_4_of_4 {width:100%;} .span_3_of_4 {width:100%;} .span_2_of_4 {width:100%;} .span_1_of_4 {width:100%;} } /* GRID OF FIVE ============================================================================= */ .span_5_of_5 {width:100%;} .span_4_of_5 {width:79.68%;} .span_3_of_5 {width:59.36%;} .span_2_of_5 {width:39.04%;} .span_1_of_5 {width:18.72%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width: 480px) { .span_5_of_5 {width:100%;} .span_4_of_5 {width:100%;} .span_3_of_5 {width:100%;} .span_2_of_5 {width:100%;} .span_1_of_5 {width:100%;} } /* GRID OF SIX ============================================================================= */ .span_6_of_6 {width:100%;} .span_5_of_6 {width:83.06%;} .span_4_of_6 {width:66.13%;} .span_3_of_6 {width:49.2%;} .span_2_of_6 {width:32.26%;} .span_1_of_6 {width:15.33%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width: 480px) { .span_6_of_6 {width:100%;} .span_5_of_6 {width:100%;} .span_4_of_6 {width:100%;} .span_3_of_6 {width:100%;} .span_2_of_6 {width:100%;} .span_1_of_6 {width:100%;} } /* GRID OF SEVEN ============================================================================= */ .span_7_of_7 {width:100%;} .span_6_of_7 {width:85.48%;} .span_5_of_7 {width:70.97%;} .span_4_of_7 {width:56.45%;} .span_3_of_7 {width:41.94%;} .span_2_of_7 {width:27.42%;} .span_1_of_7 {width:12.91%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width: 480px) { .span_7_of_7 {width:100%;} .span_6_of_7 {width:100%;} .span_5_of_7 {width:100%;} .span_4_of_7 {width:100%;} .span_3_of_7 {width:100%;} .span_2_of_7 {width:100%;} .span_1_of_7 {width:100%;} } /* GRID OF EIGHT ============================================================================= */ .span_8_of_8 {width:100%;} .span_7_of_8 {width:87.3%;} .span_6_of_8 {width:74.6%;} .span_5_of_8 {width:61.9%;} .span_4_of_8 {width:49.2%;} .span_3_of_8 {width:36.5%;} .span_2_of_8 {width:23.8%;} .span_1_of_8 {width:11.1%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width: 480px) { .span_8_of_8 {width:100%;} .span_7_of_8 {width:100%;} .span_6_of_8 {width:100%;} .span_5_of_8 {width:100%;} .span_4_of_8 {width:100%;} .span_3_of_8 {width:100%;} .span_2_of_8 {width:100%;} .span_1_of_8 {width:100%;} } /* GRID OF NINE ============================================================================= */ .span_9_of_9 {width:100%;} .span_8_of_9 {width:88.71%;} .span_7_of_9 {width:77.42%;} .span_6_of_9 {width:66.13%;} .span_5_of_9 {width:54.84%;} .span_4_of_9 {width:43.55%;} .span_3_of_9 {width:32.26%;} .span_2_of_9 {width:20.97%;} .span_1_of_9 {width:9.68%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width: 480px) { .span_9_of_9 {width:100%;} .span_8_of_9 {width:100%;} .span_7_of_9 {width:100%;} .span_6_of_9 {width:100%;} .span_5_of_9 {width:100%;} .span_4_of_9 {width:100%;} .span_3_of_9 {width:100%;} .span_2_of_9 {width:100%;} .span_1_of_9 {width:100%;} } /* GRID OF TEN ============================================================================= */ .span_10_of_10 {width:100%;} .span_9_of_10 {width:89.84%;} .span_8_of_10 {width:79.68%;} .span_7_of_10 {width:69.52%;} .span_6_of_10 {width:59.36%;} .span_5_of_10 {width:49.2%;} .span_4_of_10 {width:39.04%;} .span_3_of_10 {width:28.88%;} .span_2_of_10 {width:18.72%;} .span_1_of_10 {width:8.56%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width: 480px) { .span_10_of_10 {width:100%;} .span_9_of_10 {width:100%;} .span_8_of_10 {width:100%;} .span_7_of_10 {width:100%;} .span_6_of_10 {width:100%;} .span_5_of_10 {width:100%;} .span_4_of_10 {width:100%;} .span_3_of_10 {width:100%;} .span_2_of_10 {width:100%;} .span_1_of_10 {width:100%;} } /* GRID OF ELEVEN ============================================================================= */ .span_11_of_11 {width:100%;} .span_10_of_11 {width:90.76%;} .span_9_of_11 {width:81.52%;} .span_8_of_11 {width:72.29%;} .span_7_of_11 {width:63.05%;} .span_6_of_11 {width:53.81%;} .span_5_of_11 {width:44.58%;} .span_4_of_11 {width:35.34%;} .span_3_of_11 {width:26.1%;} .span_2_of_11 {width:16.87%;} .span_1_of_11 {width:7.63%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width: 480px) { .span_11_of_11 {width:100%;} .span_10_of_11 {width:100%;} .span_9_of_11 {width:100%;} .span_8_of_11 {width:100%;} .span_7_of_11 {width:100%;} .span_6_of_11 {width:100%;} .span_5_of_11 {width:100%;} .span_4_of_11 {width:100%;} .span_3_of_11 {width:100%;} .span_2_of_11 {width:100%;} .span_1_of_11 {width:100%;} } /* GRID OF TWELVE ============================================================================= */ .span_12_of_12 {width:100%;} .span_11_of_12 {width:91.53%;} .span_10_of_12 {width:83.06%;} .span_9_of_12 {width:74.6%;} .span_8_of_12 {width:66.13%;} .span_7_of_12 {width:57.66%;} .span_6_of_12 {width:49.2%;} .span_5_of_12 {width:40.73%;} .span_4_of_12 {width:32.26%;} .span_3_of_12 {width:23.8%;} .span_2_of_12 {width:15.33%;} .span_1_of_12 {width:6.86%;} /* GO FULL WIDTH AT LESS THAN 480 PIXELS */ @media only screen and (max-width: 480px) { .span_12_of_12 {width:100%;} .span_11_of_12 {width:100%;} .span_10_of_12 {width:100%;} .span_9_of_12 {width:100%;} .span_8_of_12 {width:100%;} .span_7_of_12 {width:100%;} .span_6_of_12 {width:100%;} .span_5_of_12 {width:100%;} .span_4_of_12 {width:100%;} .span_3_of_12 {width:100%;} .span_2_of_12 {width:100%;} .span_1_of_12 {width:100%;} } /* Expanding Panels (FAQ's or Attach a File Link) ===================== */ /* Format our link that will be used to trigger the toggle */ .TriggerText {font-family:Arial Narrow, Arial; font-size:20px; width:95%; color:#333; padding:25px 10px 5px 10px;} .CRMAttchFile .TriggerText {font-family:Arial Narrow, Arial; font-size:16px; width:95%; color:#333; padding:15px 10px 5px 10px;} div.TriggerText:hover {color:#f60; text-decoration:none; cursor:pointer;} /* Set the container DIV that will be transitioned */ .Outer {height:0; position:relative; overflow:hidden; width:auto} /* Set the inner DIV(s), that hold the real content. *** THIS MUST HAVE A BORDER OR PADDING APPLIED! Otherwise the dynamic height calc may fail due to not recognising margin values */ .Inner {padding:5px; width:auto;} /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ /* @media handling to change layout and show/hide elements */ /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ /* MAKE LAYOUT SHUFFLE at 480px ============================================ */ @media only screen and (max-width: 480px) { .col {margin:1% 0 1% 0%;} /* Use the full width of the screen */ .wrapper {width:96%;} /* Control images when they have more space to display */ .responsive-image img {height:auto !important; max-width:80% !important; width:80% !important;} /* Footer */ .cNavBottom {text-align:center;} .FooterHR {visibility:visible !important;} /* IMAGE ALIGNMENT */ .ImageRight {float:none; margin:12px;} .ImageLeft {float:none; margin:12px;} } /* MAKE LAYOUT SHUFFLE at 768px */ @media only screen and (max-width: 768px) { .wrapper {} .OuterShadowBox {width:98%;} .cNavMain {border-bottom:none;} .FooterNavText {text-align:center; font-size:18px !important; line-height:26px !important; border-bottom:1px solid #666; margin-bottom:15px; padding-bottom:10px;} .PageFooter hr {border-top-width:2px; border-top-style:solid; border-right-style:none; border-bottom-style:none; border-left-style:none; border-top-color:#ccc; margin-right:0px; margin-left:0px;} } /* MAKE LAYOUT SHUFFLE at 1000px ============================================ */ @media only screen and (max-width: 1000px) and (min-width: 481px) { /* Use most of the width of the screen */ .wrapper {} } /* IMAGE ALIGNMENT */ .ImageRight {float:right; margin:12px 6px 12px 25px;} .ImageLeft {float:left; margin:12px 25px 12px 0;} /* SpecialFeature */ .SpecialItem {width:98%; margin:26px auto; background-color:#fff5d6; padding:0 0 16px 0; text-align:center; color:#639; font-size:18px; line-height:22px; border-bottom:4px solid #6a3995; -webkit-box-shadow:0 0 10px 10px rgba(76, 76, 76, 0.1); -moz-box-shadow:0 0 10px 10px rgba(76, 76, 76, 0.1); box-shadow:0 0 10px 10px rgba(76, 76, 76, 0.1);} .SpecialItemHeader {padding:14px 20px; text-align:center; background:url(/assets/images/tile_special_item.jpg) #7711b4 top no-repeat; background-size:100% auto;} .SpecialItemHeader a:link, .SpecialItemHeader a:visited {text-decoration:none !important;} .SpecialItemHeader a:hover, .SpecialItemHeader a:active {text-decoration:none !important; cursor:pointer;} .SpecialItemHeader h3 {color:#fff; line-height:normal; margin:0;} .SpecialItemText {width:95%; margin:10px auto;} .SpecialItemLink {font-size:16px;} .SpecialItemLink a:link, .SpecialItemLink a:visited {display:block; width:180px; color:#fff; background-color:#ea9427; text-align:center; padding:12px; text-decoration:none; margin:18px auto;} .SpecialItemLink a:hover, .SpecialItemLink a:active {background-color:#eba954;} /* Download Item */ .DownloadItem {width:98%; margin:26px auto;} .DownloadItem hr {border-top-width:4px; border-top-style:solid; border-right-style:none; border-bottom-style:none; border-left-style:none; border-top-color:#fb9738; margin-right:0px; margin-left:0px;} .DownloadItem h3 {color:#522e91;} .DownloadItemBox {border:1px solid #c385e9; border-radius:6px; padding:14px; margin:24px auto; background-color:#f5f5f5; -webkit-box-shadow:0 0 6px 6px rgba(76, 76, 76, 0.1); -moz-box-shadow:0 0 6px 6px rgba(76, 76, 76, 0.1); box-shadow:0 0 6px 6px rgba(76, 76, 76, 0.1); background-image: linear-gradient(0deg, #f0ebf1, #ffffff 90%); overflow:hidden;} .DownloadItemBox:hover {opacity:0.8;} .DownloadItemText {float:right; width:74%; color:#522e91;} .DownloadItemHeader {font-size:18px;} .DownloadItemIcon {float:left; width:25%;} .WorkshopHeadingHome {background-color:#e8e6eb; padding:16px 28px; margin-top:25px;} .WorkshopHeadingHome h3 {margin:0;} /* Enrolment Declaration */ .FormDeclarationTable {font-size:16px;} .FormDeclarationTable td {padding:6px;} .FormDeclarationTable th {padding:12px 25px; font-size:18px; line-height:normal; text-align:left; font-weight:normal; color:#522e91; background-color:#e8e6eb;} /* Enrol Alert */ .EnrolAlertBox {background-color:#fcfdfc; padding:6px 20px; border:1px solid #e0d9e5; margin:20px auto;} .EnrolAlertText {font-size:14px; color:#333;} .EnrolAlertButton {text-align: center; font-weight: bold; padding: 6px 18px; margin: 10px; font-size: 14px; line-height: normal; display: inline-block; border-radius: 18px; background-color: #fff; border:1px solid #ac94d7;} a.EnrolAlertButton:link, a.EnrolAlertButton:visited {text-decoration: none; color:#522e91 !important;} a.EnrolAlertButton:hover, a.EnrolAlertButton:active {text-decoration: none; color: #fff !important; background-color: #ac94d7; transition: all 0.3s ease;} .EnrolAlertButton2 {text-align: center; font-weight: 400; padding: 6px 18px; margin: 10px; font-size: 14px; line-height: normal; display: inline-block; border-radius: 18px; background-color: #fff; border:1px solid #dbd3ea;} a.EnrolAlertButton2:link, a.EnrolAlertButton2:visited {text-decoration: none; color:#8d7bb2 !important;} a.EnrolAlertButton2:hover, a.EnrolAlertButton2:active {text-decoration: none; color: #fff !important; background-color: #ac94d7; transition: all 0.3s ease;} /* News */ .NewsText {font-size:14px; line-height:16px; padding-bottom:10px;} .NewsText a:link, .NewsText a:visited {color:#522e91; text-decoration:none !important;} /* #522e91*/ .NewsText a:hover, .NewsText a:active {color:#b6a6d2;} .NewsTextDate {font-size:11px; color:#999;} /* Booking Attendees */ .TableAddAttendees {background-color:#f7f8fd;} .TableAddAttendees caption {text-align:left; padding-left:5px; font-size:12px; font-style:italic;} .BorderAttendees {border:2px solid #e8e6eb;} .AttendeeListing {background-color:#fff; border:2px solid #8554a3; margin:20px 0;} .AttendeeListing th {color:#fff; padding:8px; font-size:14px; background-color:#8554a3; text-align:left; font-weight:normal;} .AttendeeListing td {padding:5px; font-size:12px;} .EventBookSelect {font-size:1.2em; color:#243C7A; padding-left:6px; line-height:1.4em; margin:2px 25px 0 0; width:70%; } .EventBookSelect label { display:inline; padding-left:10px; font-size:1.2em; color: ##666;; cursor: pointer;} /*.RadioButtonList input[type=radio] + label { display : inline; padding-left :10px; width : 1em; height : 1em; border : 0.0625em solid rgb(192,192,192); border-radius : 1em; background : rgb(211,168,255); background-image : -moz-linear-gradient(rgb(240,240,240),rgb(211,168,255)); background-image : -ms-linear-gradient(rgb(240,240,240),rgb(211,168,255)); background-image : -o-linear-gradient(rgb(240,240,240),rgb(211,168,255)); background-image : -webkit-linear-gradient(rgb(240,240,240),rgb(211,168,255)); background-image : linear-gradient(rgb(240,240,240),rgb(211,168,255)); vertical-align : middle; line-height : 1em; font-size : 14px; }*/