﻿/* 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-size:14px; color:#000; line-height:145%; margin-top:14px; background-color:#4777bb; background-image:url(/assets/images/tile_background.gif);}

p							{margin:2px 0 8px 0;}

h1						{font-size:26px; line-height:32px; font-weight:bold; color:#2e447a; margin:20px 0px 3px 0px;}
h2						{font-size:20px; font-weight:bold; color:#000; margin:16px 0px 3px 0px;}
h3						{font-size:16px; font-weight:bold; color:#666; margin:13px 0px 3px 0px;}
h4						{font-size:14px; font-weight:bold; color:#999; margin:10px 0px 2px 0px;}
h5						{font-size:14px; font-weight:bold; color:#999; margin:10px 0px 2px 0px;}
h6						{font-size:14px; font-weight:bold; color:#999; margin:10px 0px 2px 0px;}

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:#4777bb; text-decoration:underline;}
a:active, a:hover, a:focus	{color:#ec5223; text-decoration:underline;}


/* streamSWEET additional Fonts 
===================== */
.TextStd				{}
.TextEmphasis	{color:#999; font-style:italic;}
.TextStrong		{font-weight:bold;}
.TextSml1			{font-size:12px; color:#666; line-height:14px;}
.TextSml2			{font-size:11px; color:#999;}
.TextLarge			{font-size:18px;}
.TextQuote			{font-size:14px; font-weight:bold; color:#4898d4; line-height:18px; font-style:italic;}
.TextLabel			{font-size:12px; 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:26px; font-weight:bold; color:#2e447a; line-height:32px;}
.Head2			{font-size:20px; font-weight:bold; color:#000; line-height:26px;}
.Head3			{font-size:16px; font-weight:bold; color:#666; line-height:20px;}
.Head4			{font-size:12px; font-weight:bold; color:#999; line-height:18px;}
.Text1			{font-size:12px; color:#000;}
.Text2			{font-size:12px; color:#999;}
.Text3			{font-size:12px; color:#999; font-style:italic;}

/* ======================================================================================== */
/* ======================================================================================== */
/* Template Layout */
/* ======================================================================================== */
/* ======================================================================================== */


/* Home 
===================== */
.hBanner								{padding:8px 0px; background-color:#fff;}

.hNavMain							{width:60%; margin:0 auto; left:60px; position:absolute;}

.hPage									{padding:0; text-align:left; background-color:#fff;}

.hContent1							{width:100%; padding:0; background-color:#fff; text-align:left; vertical-align:top; margin-left:auto; margin-right:auto;}

.hContent2							{width:88%; margin:0 auto; text-align:left; vertical-align:top; margin:0 auto; padding-bottom:20px;}

.hFooter								{padding:15px; vertical-align:top;}

/* Not Used */
.hLogin									{width:425px; float:right; background-color:#f3eff4; padding:8px 3px 10px 24px; border-bottom:6px solid #ede8ec;}
.hBasket								{width:300px; float:left;}
.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;}	

.hNavBottom						{padding:15px 30px 20px 30px; vertical-align:top; color:#fff;}
.hFooterInfo						{background-color:#144f97;}
.hBreadcrumbs					{padding:0px 0px 0px 20px;}


/* Content - Standard
===================== */		

/* Create a container to surround each logical section of the page - creates full page width horizontal 'slices' */

.OuterBoxShadow				{background-color:#fff;
												-webkit-box-shadow: 0 0 8px 8px rgba(0, 0, 0, 0.1);
												-moz-box-shadow: 0 0 8px 8px rgba(0, 0, 0, 0.1);
												box-shadow: 0 0 8px 8px rgba(0, 0, 0, 0.1);}	
												
.wrapper								{clear:both; /*width:80%;*/ max-width:980px; margin:0 auto; padding:0; position:relative;}

.MenuWrapper						{width:100%; margin:0 auto; position:relative; min-height:42px; background:url(/assets/images/tile_menu_2.gif) no-repeat #4470b1;
}

.cBanner								{padding:8px 0px; background-color:#aec1c8;}

.cNavMain							{width:60%; margin:0 auto; left:60px; position:absolute;}

.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;}

}

.cPage									{padding:0; text-align:left; min-height:400px; background-color:#fff;}

.cNavBottom						{padding:15px 30px 20px 30px; vertical-align:top; color:#fff;}

.cContent1							{width:94%; padding:10px 0; background-color:#fff; text-align:left; vertical-align:top; margin-left:auto; margin-right:auto;}

.cContent2							{padding:0px 0px 20px 0; text-align:left; vertical-align:top;}

.cFooterInfo						{background-color:#144f97; padding-bottom:20px;}

.cFooter								{padding:15px; vertical-align:top;}

.cBannerCol1						{width:300px; float:left; height:160px; overflow:hidden;}

.cBannerCol2						{width:662px; float:left; height:160px; overflow:hidden;}

.cLogin									{min-width:200px; float:right; background-color:#f5f5f5; padding:8px 3px 10px 24px; border-bottom:6px solid #d8d8d8; margin-top:6px;}
.cBasket								{width:300px; float:left; margin-top:6px;}
.cBasket a:link, .cBasket a:visited	{color:#fff; text-decoration:none;}
.cBasket a:hover, .cBasket a:active	{color:#fff; text-decoration:underline;}

.cNavBreadcrumbs				{}

/* 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 */

/* This new class group is used to replace clearfix */
.group:after {content:""; display:table; clear:both;}

/* ======================================================================================== */
/* ======================================================================================== */
/* 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 #999;}
.datagrid								{font-size:12px; background-color:#fff;}
.datagrid td							{padding:1px 0 1px 4px !important;; border-bottom:1px solid #fff;}
.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 a			{text-decoration:none; display:block; padding:4px 4px 4px 0px;}
.datagridSelected				{background-color:#dfe6cf;}
.datagridSelected td		{padding:1px 0 1px 4px !important;; border-bottom:1px solid #c1c7b5;}
.datagridSelected td a	{text-decoration:none; display:block; padding:4px 4px 4px 0px;}
.datagridOver						{background-color:#fcfce3;}
.datagridOver td					{padding:1px 0 1px 4px !important;; border-bottom:1px solid #e8e8bc;}
.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:#7a7a7a; 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:#407db4;}
.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:#A1FFA1; background-image:linear-gradient(0deg, #A1FFA1, #EDFFED 90%); 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:#FF9191; background-image:linear-gradient(0deg, #FF9191, #FCE3E3 90%); 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:#FFDA96; background-image:linear-gradient(0deg, #FFDA96, #FFF3DE 90%); 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:11px; color:#fff; line-height:15px;}
.FooterText a:link, .FooterText a:visited		{color:#fff; text-decoration:underline;}
.FooterText a:hover, .FooterText a:active		{color:#ec5223; 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						{padding:4px; font-size:12px; color:#000; background-color:#b0becd;}
.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								{border:1px solid #cbe7ee; margin-top:8px; margin-bottom:8px; background-color:#fafbfc;}
.FormTable th						{font-size:14px; color:#fff; font-weight:bold; padding:7px 5px 5px 15px; background-color:#416eb0; text-align:left; border-bottom:1px solid #e8e8e8;}
.FormTable td						{font-size:12px; color:#333; padding:4px 5px 4px 6px;}
.FormTableHead						{font-size:12px; color:#333; font-weight:bold; padding:7px 5px 5px 15px; border:1px solid #bebebe; background-image:url(/assets/images/tile_formheader.jpg); background-repeat:repeat-x;}
.FormCellHeadSub					{font-size:12px; color:#000; font-weight:bold; padding:3px; background-color:#ecf1f7; background-image:url(/assets/images/tile_formheader_sub.jpg); background-repeat:repeat-x;}
.FormSectionTop					{border:1px solid #888; margin-top:1px;}
.InstructTextSml					{font-size:10px; color:#999;}
.FormRequired						{font-size:14px; color:#f60;}
.ErrStdRed								{font-size:11px; color:#f00; vertical-align:top}

/* Form Buttons
===================== */
.FormButton							{padding:8px 12px 8px 12px; font-size:14px; color:#393b4a; background-image:url(/assets/images/button_tile.jpg); background-repeat:repeat-x; background-color:#e9e9e9; border:2px solid #d3d3d3; text-decoration:none;}
.FormButton:hover				{padding:8px 12px 8px 12px; font-size:14px; color:#7a7a7a; background-image:url(/assets/images/button_tile_hover.jpg); background-repeat:repeat-x; background-color:#d7d7d7; border:2px solid #d3d3d3; text-decoration:none; cursor:pointer;}
.FormButtonSubmit				{padding:8px 12px 8px 12px; font-size:14px; color:#393b4a; background-image:url(/assets/images/button_tile.jpg); background-repeat:repeat-x; background-color:#e9e9e9; border:2px solid #d3d3d3; text-decoration:none;}
.FormButtonSubmit:hover	{padding:8px 12px 8px 12px; font-size:14px; color:#7a7a7a; background-image:url(/assets/images/button_tile_hover.jpg); background-repeat:repeat-x; background-color:#d7d7d7; border:2px solid #d3d3d3; text-decoration:none; cursor:pointer;}

/* A HREF Buttons
===================== */
.ButtonA  {background-color:#e9e9e9; text-align:center; padding:3px 15px 3px 15px; margin:0 6px; border-radius:3px;}
a.ButtonA:link, a.ButtonA:visited   {color:#393b4a; text-decoration:none;}
a.ButtonA:hover, a.ButtonA:active   {color:#7a7a7a; background-color:#d7d7d7; text-decoration:none;}

.ButtonALge  {background-color:#ff9c2b; text-align:center; padding:4px 20px 4px 20px; margin:0 6px; border-radius:4px; font-size:16px;}
a.ButtonALge:link, a.ButtonALge:visited   {color:#393b4a; text-decoration:none;}
a.ButtonALge:hover, a.ButtonALge:active   {color:#7a7a7a; background-color:#d7d7d7; text-decoration:none;}

/* 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:33px; background:url(/assets/images/button_booknow.gif) no-repeat 0px 0px; margin:10px 0; padding:0;border:none; background-color:transparent; cursor:pointer; display:inline-block;}
.ImgBtnEventBook:hover	{opacity:.8;}

.ImgBtnEventBookLge			{width:174px; height:60px; background:url(/assets/images/button_booknow_lge.gif) no-repeat 0px 0px; margin:0; padding:0;border:none; background-color:transparent; cursor:pointer; display:inline-block;}
.ImgBtnEventBookLge:hover	{opacity:.8;}

/* EVENT MULTIPLE LOCATIONS */
.EventGridTable					{width:100%; margin-top:20px; margin-bottom:30px; background-color:#f6f7f5;}
.EventGridTable th			{background-color:#666; color:#fff; font-size:12px; padding:6px 5px;}
.EventGridTable td			{color:#000; font-size:11px; padding:3px; 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:101px; height:29px; 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 Menu
===================== */

#nav {width:509px; /* 1000 */position:absolute; z-index:100000; /* 30 480 */}
#nav > a {display:none;}
#nav ul {list-style-type:none; margin:0; padding:0;}
#nav li {position:relative;}
#nav li a {color:#1f285e; display:block; text-decoration:none;}
/*#nav li a:active {background-color:#c00 !important;}*/
#nav span:before {width:0; height:0; border:0.313em solid transparent; /* 5 */ border-bottom:#efa585; border-top-color:#efa585; content:''; vertical-align:middle; display:inline-block; position:relative; left:-10px; /* Move the down Arrow */}
#nav p {margin:0; padding:0;}
/* first level */

#nav > ul {height:50px; /* 60 */ }
#nav > ul > li {height:100%; float:left;} /* IC */ 

#nav > ul > li > a {height:100%; font-size:1em; /* 24 */ line-height:2.5em; /* 60 (24) */ text-align:center;}
/* #nav > ul > li:not( :last-child ) > a {border-right:1px solid #cc470d;} */
/* #nav > ul:not( :hover ) > li.active > a {background-color:#dae9f6;} */

/* second level */

/* Transition Handling Notes
	- Apply the transition effect to the 'max-height' attribute as transition does not work on 'height:auto'. 
			Make sure the destination 'max-height' is bigger than the size of the menu
			Understand that the transition applies to max-height value, not the actual height of the element.
				So if it is closing a small flyout you can see a delay.  So make the max-height as small as possible, but still b
	- Use this handling:  'display:block; max-height:0;' to hide the flyout instead of 'display:none' as transition does not work on the latter.
	- Make sure 'overflow:hidden' is included otherwise the <li> content shows before it is wanted.
	- Including 'opacity' with a short transition is a nice touch on the full menu - makes the transitions nicer.
	   BUT downside on the collapsed version as it can cause sub-panels to hide before expected which can be a little confusing.
	   Possibly added handling in the @media section so the collapsed view does not use opacity.
*/

#nav li ul {width:322px; background-color:#d4dfee; display:block; position:absolute; top:100%; overflow:hidden; max-height:0; opacity:0; transition: max-height 1.5s, opacity .75s; -webkit-transition: max-height 1.5s, opacity .75s;}
#nav li:hover ul {left:0; right:0;}
#nav li:not( :first-child ):hover ul {left:-1px; max-height:600px; opacity:1;}
#nav li ul a {font-size:1em; /* 20 */ border-top:1px solid #96afd3; padding:0.75em; /* 15 (20) */}
#nav li ul li a:hover,  #nav li ul:not( :hover ) li.active a {background-color:#dae9f6;}

/* image handling */
#nav > ul > li.img_menu_1004 {background:url(/assets/images/img_menu_1004.gif) no-repeat; width:101px;} /* Home */
#nav > ul > li.img_menu_1004:hover {background:url(/assets/images/img_menu_1004_on.gif) no-repeat;}
#nav > ul > li.img_menu_1004.active {background:url(/assets/images/img_menu_1004_on.gif) no-repeat;}

#nav > ul > li.img_menu_6563 {background:url(/assets/images/img_menu_6563.gif) no-repeat; width:108px;} /* Gallery */
#nav > ul > li.img_menu_6563:hover {background:url(/assets/images/img_menu_6563_on.gif) no-repeat;}
#nav > ul > li.img_menu_6563.active {background:url(/assets/images/img_menu_6563_on.gif) no-repeat;}

#nav > ul > li.img_menu_6564 {background:url(/assets/images/img_menu_6564.gif) no-repeat; width:107px;}  /* Services */
#nav > ul > li.img_menu_6564:hover {background:url(/assets/images/img_menu_6564_on.gif) no-repeat;}
#nav > ul > li.img_menu_6564.active {background:url(/assets/images/img_menu_6564_on.gif) no-repeat;}

#nav > ul > li.img_menu_6565 {background:url(/assets/images/img_menu_6565.gif) no-repeat; width:118px;} /* Contact */
#nav > ul > li.img_menu_6565:hover {background:url(/assets/images/img_menu_6565_on.gif) no-repeat;}
#nav > ul > li.img_menu_6565.active {background:url(/assets/images/img_menu_6565_on.gif) no-repeat;}

#nav p {display:none;}

/* image handling ends */

 @media only screen and ( max-width: 480px) /* 640 */ {
html {font-size:75%; /* 12 */}
#nav {width:100%; position:relative; margin:0; top:auto; left:auto; z-index:100;}
#nav > a {width:175px; /* 50 */ height:42px; /* 50 */ text-align:left; text-indent:-9999px; position:relative; background:url(/assets/images/respon_menu_button.png) no-repeat top /* color if required #154f97 */;} /* Open Menu Image-Link */
#nav > a:before,  #nav > a:after {position:absolute; content:'';}
#nav > a:after {top:60%;}
#nav:not( :target ) > a:first-of-type,  #nav:target > a:last-of-type {display:block;}
/* first level */

#nav > ul {height:auto; display:none; position:absolute; left:-10px; right:0;}
#nav:target > ul {display:block;}
#nav > ul > li {width:100%; float:none;}
#nav > ul > li > a {height:auto; text-align:left; padding:0 0.833em; /* 20 (24) */ font-weight:bold;}
#nav > ul > li > a {border-right:none; border-bottom:1px solid #96afd3; background-color:#d4dfee; width:300px;}
/* second level */

#nav li ul {position:static; padding:0; /* 20 */ padding-top:0;}

/* image handling */
#nav > ul > li.img_menu_1004 {background-image:none;} /* Home */
#nav > ul > li.img_menu_1004:hover {background-image:none;}
#nav > ul > li.img_menu_1004.active {background-image:none;}

#nav > ul > li.img_menu_6563 {background-image:none;} /* Gallery */
#nav > ul > li.img_menu_6563:hover {background-image:none;}
#nav > ul > li.img_menu_6563.active {background-image:none;}

#nav > ul > li.img_menu_6564 {background-image:none;} /* Services */
#nav > ul > li.img_menu_6564:hover {background-image:none;}
#nav > ul > li.img_menu_6564.active  {background-image:none;}

#nav > ul > li.img_menu_6565 {background-image:none;} /* Contact */
#nav > ul > li.img_menu_6565:hover  {background-image:none;}
#nav > ul > li.img_menu_6565.active  {background-image:none;}


#nav p {display:inline;}

/* image handling ends */

}

/* First level - Horizontal - Flyout 
===================== */
/* TEXT BASED MENU */
#navMain, #navMain ul		{list-style:none; line-height:14px; padding:0; margin: 0px 0px 0px 0px; border-left:1px solid #fff; z-index:500; position:relative;}
#navMain a							{display:block; color:#18263e; text-decoration:none; padding:8px 12px 8px 12px; font-size:13px; font-weight:normal;}
#navMain a.daddy				{background:url(/assets/images/rightarrow2.gif) 140px 6px no-repeat;}
#navMain a.sel					{background-color:#fff; opacity:0.9; filter: Alpha(opacity=90); /* IE8 and earlier */}
#navMain li							{list-style:none; float:left; padding:0; border-right:1px solid #fff;}
#navMain li ul					{position:absolute; left:-2000px; height:auto; width:185px; w\idth:160px; margin:0 0 0 -1px; border:solid #ccc; border-width:0 1px 1px 1px; background-color:#fff;}
#navMain li li					{width:160px; border:solid #ccc; border-width:1px 0 0 0; }
#navMain li ul a				{width:160px; w\idth:135px; font-size:12px; font-weight:normal;}
#navMain li ul ul				{margin:-21px 0 0 160px; }
#navMain li:hover ul ul, #navMain li:hover ul ul ul, #navMain li.sfhover ul ul, #navMain li.sfhover ul ul ul {left:-2000px;}
#navMain li:hover ul, #navMain li li:hover ul, #navMain li li li:hover ul, #navMain li.sfhover ul, #navMain li li.sfhover ul, #navMain li li li.sfhover ul {left:auto;}
#navMain li:hover, #navMain li.sfhover {background:#cff5ff;}
#navMain li.separator		{background-color:#7c6240; padding:4px 5px 3px 5px;}

/* IMAGE BASED 
#navMain, #navMain ul		{width:940px; list-style:none; line-height:14px; padding:0; margin: 0px 0px 0px 0px; z-index:500; position:relative;}
#navMain a							{display:block; color:#18263e; text-decoration:none; font-size:12px;}
#navMain a.daddy				{background:url(/assets/images/rightarrow2.gif) 140px 6px no-repeat;}
#navMain a.sel					{background-color:#d6dde1;}
#navMain li							{list-style:none; float:left; padding:0;}
#navMain li ul					{position:absolute; left:-2000px; height:auto; width:195px; width:170px; margin:0 0 0 -1px; border:solid #999; border-width:0 1px 1px 1px; background-color:#f1f3f4;}
#navMain li li					{width:170px; border:solid #999; border-width:1px 0 0 0; }
#navMain li ul a				{width:170px; w\idth:145px; padding:6px 15px 6px 10px;}
#navMain li ul ul				{margin:-21px 0 0 170px; }
#navMain li:hover ul ul, #navMain li:hover ul ul ul, #navMain li.sfhover ul ul, #navMain li.sfhover ul ul ul {left:-2000px;}
#navMain li:hover ul, #navMain li li:hover ul, #navMain li li li:hover ul, #navMain li.sfhover ul, #navMain li li.sfhover ul, #navMain li li li.sfhover ul {left:auto;}
#navMain li:hover, #navMain li.sfhover { background:#d6dde1; }
#navMain li.separator		{}
*/

/* 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:#000; background-image:url(/assets/images/arrow_subnav_1_on.gif);}
#navSub a								{display:block; color:#333; text-decoration:none;}
#navSub li								{margin:0px; padding:0px; background:url(/assets/images/arrow_subnav_1.gif) 3px 6px no-repeat; list-style:none;}
#navSub li a							{width:204px; w\idth:184px; padding:4px 5px 3px 15px; background:url(/assets/images/arrow_subnav_1.gif) 3px 6px no-repeat;}
#navSub li ul						{border:0;}
#navSub li li .sel			{background-color:#fff; color:#c00; background-image:url(/assets/images/arrow_subnav_2_on.gif);}
#navSub li li						{margin:0px; padding:0px; background:url(/assets/images/arrow_subnav_2.gif) 10px 6px no-repeat; background-color:#f7f7f7;}
#navSub li li a					{width:204px; w\idth:174px; padding:4px 5px 3px 25px; background:url(/assets/images/arrow_subnav_2.gif) 10px 6px no-repeat;}
#navSub a:hover					{background-color:#fff;}

/* 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:12px; 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:12px; color:#000; line-height:14px;}
.MenuBotL1 a:link				{color:#fff; text-decoration:underline;}
.MenuBotL1 a:visited		{color:#fff; text-decoration:underline;}
.MenuBotL1 a:active, .MenuBotL1 a:hover		{color:#ec5223; text-decoration:underline;}

.MenuBotL2							{font-size:9px; color:#000; line-height:14px;}
.MenuBotL2 a:link				{color:#fff; text-decoration:underline;}
.MenuBotL2 a:visited		{color:#fff; text-decoration:underline;}
.MenuBotL2 a:active, .MenuBotL2 a:hover		{color:#ec5223; text-decoration:underline;}

/* ======================================================================================== */
/* ======================================================================================== */
/* 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;}

/* Homepage Hero */
.HeroPosition						{margin:40px auto; width:94%;}

/* 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; font-size:11px;}

/* 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 
===================== */

/* PRODUCT GRID LAYOUT*/

/* Product Category Layout */

.ProductPanel							{width:31%; min-width:180px; min-height:260px; float:left; margin-left:0; margin-bottom:14px; margin-right:2%; /* border:1px solid #e1e1e1;*/ box-shadow:0 0 2px 2px #e1e1e1;}
.ProductPanel:hover						{opacity:0.9; background-color:#fafafa;}
.ProductPanelInfo					{width:88%; margin:10px auto; text-align:center;}
.ProductPanelInfo h2			{font-size:14px !important; color:#36C;}
.ProductPanelInfo p				{font-size:10px !important; color:#333; line-height:12px !important;}
.ProductPanelInfo a:link, .ProductPanelInfo a:visited	{text-decoration:none; color:#c30 !important;}
.ProductPanelInfo a:hover, .ProductPanelInfo a:active	{text-decoration:underline;}
.ProductPanelInfo img			{margin:5px auto;}

/* MAKE LAYOUT SHUFFLE at 768px */
@media only screen and (max-width: 768px) {

.ProductPanel {width:47%; min-width:240px; min-height:260px; margin-right:2%; border:1px solid #f5f5f5;}

}

/* MAKE LAYOUT SHUFFLE at 480px */
@media only screen and (max-width: 480px) {

.ProductPanel {width:98%; min-height:260px; margin-right:1%; margin-left:1%; border:1px solid #f5f5f5;}

}

/* Product Listings Layout */

/* Product Detail Layout */

/* 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:#fff; width:250px;}
.LoginPanelProfile a:link, .LoginPanelProfile a:visited {color:#69646c;}
.LoginPanelProfile a:hover, .LoginPanelProfile a:active {color:#ff8c0a;}
.LoginPanelProfileHeader		{color:#fff; background-color:#384f7b; padding:8px 12px; font-size:12px; font-weight:bold;}
.LoginPanelProfileSelect		{font-size:12px; padding:3px 10px;}
.LoginPanelCancel						{background-color:#ccc; 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:#06c;}

/* CRM Chat
===================== */
.CRMChatPanel	{margin-top:20px; padding-bottom:10px;}
.CRMChatBorder {border:1px solid #ddd;}
.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; }
.ChatBoxPanel {Width:750px; }
.ChatBoxPanelInput {border:1px solid #999; background-color:#f9faeb; padding:2px;}
.ChatBox	{}
.ChatBoxButton {float:right;}
.CRMChat_AttachedFile {Margin-top:5px;}

/* ======================================================================================== */
/* ======================================================================================== */
/* Static */
/* ======================================================================================== */
/* ======================================================================================== */
.ShrinkWrap				{display:block;}
.nobr								{display:inline; white-space:nowrap;}
.BackgroundWhite		{background-color:#fff;}
.BackgroundGrey			{background-color:#ccc;}
.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;}
.BorderTop					{border-top:3px solid #bbe7c8;}
.DividerLine			{margin:10px 0; background-color:#ccc; height:4px;}
.Border3Grey			{border:3px solid #e2dbe6;}
.Border1Black			{border:1px solid #000;}

.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%;}
.Width33	{width:33%;}
.Width34	{width:34%;}
.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;}
.ProductImage				{margin:5px auto !important;}

/* 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;} 

/* ======================================================================================== */
/* ======================================================================================== */
/* 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; }

/*  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%;}
}


/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/* @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:98%;}
	
	/* 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;}
	
}

/* MAKE LAYOUT SHUFFLE at 768px */
@media only screen and (max-width: 768px) {

	.wrapper {}
	.OuterShadowBox {width:98%;}
	.MenuWrapper	{}



}

/*  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 {}
}


/* ======================================================================================== */
/* ======================================================================================== */
/* Custom */
/* ======================================================================================== */
/* ======================================================================================== */

.IntroText							{width:90%; margin:20px auto; ont-size:14px; line-height:20px; color:#000; text-align:left;}

.HomeFeaturePanel			{width:100%; background-image:url(/assets/images/home_feature_tile.jpg); background-repeat:repeat-x; padding:10px 0; background-color:#e9e9e9;}

.HomeFeatureList				{width:99%;}

.HomeFeatureList td		{padding:4px;}

.BaseFeature						{border-radius:10px; -webkit-border-radius:10px; border:1px solid #ccc; padding:14px 14px 20px 14px; font-size:12px; line-height:16px !important; color:#000; margin:10px auto; min-height:260px; -webkit-box-shadow: 0 0 8px 8px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 0 8px 8px rgba(0, 0, 0, 0.1); box-shadow: 0 0 8px 8px rgba(0, 0, 0, 0.1);}

/* BASE FEATURE RESPONSIVE */

/*  SECTIONS  */
.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  COLUMN SETUP  */
.colBase {
	display: block;
	float:left;
	margin: 1% 0 1% 3.6%;
}
.colBase:first-child { margin-left: 0; }

/*  GRID OF TWO  */
.span_2_of_2Base {
	width: 100%;
}
.span_1_of_2Base {
	width: 48.2%;
}

/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */

@media only screen and (max-width: 480px) {
	.colBase { 
		margin: 1% 0 1% 0%;
	}
}

@media only screen and (max-width: 480px) {
	.span_2_of_2Base, .span_1_of_2Base { width: 100%; }
}

.NoBullet ul			{list-style:none;}