
html { overflow-y:scroll !important; background:#8D8E8E url(images/background.png) repeat-x; }
body { background-color:Transparent; color:Black; margin:0; } 

/* Colours names/numbers used in skin
 
   LessLight #E0E0E0
   Grey      #525252
   Dark      #2A2A2A
   Green     #297601 
   Orange    #EA972A

   Lighest Green #389F03 -- from the header image
   Darkest Green #297601 

   Lighest Dark Grey #3E3E3E
   Darkest Dark Grey #2A2A2A

   Top of background #CBCBCB
   Bottom of background #8D8E8E
*/

/*=================================================================*/
/*  Styles for GreenPro AI 2 skin elements and content panes.      */
/*=================================================================*/

.SkinOuter { width:1000px; margin:8px auto; background-color:White; } /* can't use an ID selector because the widebody skin has 3 of these */
.WideBodyTop { border-bottom:solid 1px White; }
.WideBodyMiddle { width:100%; margin:-8px 0; padding-top:16px; border-top:solid 1px White; border-bottom:solid 1px White; }
.WideBodyBottom { border-top:solid 1px White; }

#AILogo { float:left; position:relative; left:16px; }

.RMJCS_Menu { padding:71px 0 0 120px; margin:0 0 8px 0; background:url(images/header_bg.png) no-repeat; }
#SkinBreadCrumbs { margin:4px 8px 8px 8px; }
#SkinBreadCrumbs .active { font-weight:bold; }
   
.SkinBody { padding:0 8px; } /* can't use an ID selector because the widebody skin has 3 of these */
#SkinFooter { clear:both; text-align:center; padding-bottom:46px; background:White url(images/footer.png) no-repeat left bottom; }
#SkinFooter, #SkinFooter a { color:#297601; } 

.LeftPane { width:650px; float:left; }
.RightPane { width:318px; float:right; }
.ContentPane { clear:both; }
.LowerLeftPane { width:317px; float:left; clear:both; }
.LowerSpacer { width:16px; height:1px; float:left; } /* dirty hacky approach to spacing 3 column layout */
.LowerMidPane { width:317px; float:left; }
.LowerRightPane { width:318px; float:right; }

/*========================================================*/
/*  Styles for GreenPro AI 2 container layout.            */
/*========================================================*/

.eb { margin-bottom:16px; } /* eb = Empty Box */
.rc { margin-bottom:16px; padding:1px 8px; } /* rc = Rounded Corners, applied with jQuery */
.rc .rc { margin-top:8px; } /* apply top-margin for nested containers */

.rcWhite { background-color:White; } 
.rcLessLight { background-color:#E0E0E0; }
.rcGrey { background-color:#525252; } 
.rcDark { background-color:#2A2A2A; } 
.rcGreen { background-color:#297601; }

.rcGrey, .rcDark, .rcGreen,
.rcGrey a, .rcDark a, .rcGreen a { color:White; } /* White text and links for darker containers */
.rcWhite, .rcWhite a { color:Black; }

.eb h1, .rcLessLight h1,
.eb h2, .rcLessLight h2,
.eb h1 a, .rcLessLight h1 a { color:Black; } /* Dark grey H2s for lighter containers */

.rcGrey h1, .rcDark h1, .rcGreen h1, 
.rcGrey h2, .rcDark h2, .rcGreen h2,
.rcGrey h1 a, rcDark h1 a, .rcGreen h1 a { color:#EA972A; } /* Orange H2s for darker containers */

.ModuleWarning { float:right; width:20px; z-index:999; }

.ModuleTitle_MenuBar { float:right; }
.ModuleTitle_SubMenu { border:solid 1px Black; }
.ModuleTitle_MenuBreak td, .ModuleTitle_MenuBreak .ModuleTitle_MenuIcon { height:2px;background-color:#E0E0E0; }

/*===================================================================*/
/*  Override necessary DNN default styles.                           */
/*  Also re-define necessary styles that we need if the default      */
/*     stylesheet is not loaded.                                     */
/*===================================================================*/

/* .none { } Special empty class (not actually defined) used to override DNN generated classes. */

body, .Normal, .NormalDisabled { font-size:10pt; font-family:Arial,Helvetica,sans-serif; }
p { margin:8px 0; } 
h1 { margin:4px 0; font-size:18pt; font-weight:bold; font-family:Arial,Helvetica,sans-serif; }
h2 { margin:4px 0; font-size:14pt; font-weight:bold; font-family:Arial,Helvetica,sans-serif; }
.NormalRed { font-weight: bold; color:Red; }
a, a:link, a:visited, a:active, a:hover { color:inherit; text-decoration:underline; }
body.ielt8 .DNNEmptyPane { height:0; } /* IE7 needs this to properly collapse empty panes. */

/*========================================================*/
/*  Miscellaneous general styles for AI portal.           */
/*  These can be used all over the place.                 */
/*========================================================*/

a img { border:none; }
.NoUL { text-decoration:none; }
a.NoUL:link, a.NoUL:visited, a.NoUL:active, a.NoUL:hover { text-decoration:none; }
a.NoUL span { text-decoration:underline; }

h1 a { padding-left:24px; background:url(images/h1aw.png) no-repeat left center; }
.rcLessLight h1 a { background-image:url(images/h1all.png); }
.rcGrey h1 a { background-image:url(images/h1ag.png); }
h1 a:link, h1 a:visited { text-decoration:none; }
h1 a:hover { text-decoration:underline; }

.Clear { clear:both; }

img.TopRight { float:right; margin:0 0 4px 4px; }
img.TopLeft { float:left; margin:0 4px 4px 0; }
img.SmallPhoto { border:solid 2px #2A2A2A; } 

/*========================================================*/
/*  Miscellaneous specific styles for AI portal.          */
/*  These are probably used in only a single place.       */
/*========================================================*/

.CarcaseSpec table td { border: black 1px solid; }

#GMap_Canvas { margin-top:8px; }
div.AI_GMap_Baloon a { color:Black; } /* need div in the rule to achieve specificity */
.AI_GMap_Baloon h1 { font-size:10pt; margin:0 0 8px 0; }
.AI_GMap_Baloon p { margin:8px 0 0 0; color:Black; }
.AI_GMap_Baloon h1 + p { margin-left:1em; }

/* kitchen detail page */
div.DetailPrices { height:96px; overflow:hidden; position:relative; }
table.DetailPrices { border:none; border-spacing:0; color:White; margin:8px 0; position:absolute; left:-302px; width:906px;  }
table.DetailPrices th { color:White; padding:0; width:302px; }
table.DetailPrices td { padding-top:4px; }
table.DetailPrices td.l { color:#EA972A; }
table.DetailPrices td.r { text-align:right; color:#EA972A; font-size:24pt; font-weight:bold; }

ul.DesignDetails { list-style-image:url(images/bullet.png); padding:0 0 0 25px; margin:8px 0; }
ul.DesignDetails li { margin:4px 0; }

/*========================================================*/
/*  Functionality styles for AI portal.                   */
/*========================================================*/

/* AI_DataManager gridview appearance */
table.GridView { margin:8px 0; }
table.GridView tr.Selected { background-color:#F0F0F0; }
table.GridView tr.Pager span { font-weight:bold; }
table.GridView tr.Pager table { margin:0 auto; }
table.GridView tr.Pager td { padding: 4px; }
table.GridView td.ImageFileName:hover { background-color:#333; color:White; }
#ImagePreview { position:absolute; border:1px solid #ccc; background:#333; padding:5px; display:none; color:#fff; }
div.PagerRowsPerPage { margin:8px 0; text-align:right; }              
.ExceptionInfoPanel { display:block; min-height:48px; padding:0 8px 0 48px; 
                      background:url(/images/red-error.gif) no-repeat 8px 8px White; 
                      font-weight:bold; border:solid 1px #c0c0c0; }

#fader { position:relative; margin:8px 0; overflow:hidden; width:600px; left:9px; } 
#fader ul { list-style-type:none; margin:0; padding:0; }
#fader ul.tall { height:600px; }
#fader ul.wide { height:400px; }
#fader img { position:absolute; display:none; }
#fader ul.tall img.tall { top:0; left:100px; }
#fader ul.tall img.wide { top:100px; left:0; }
#fader ul.wide img.wide { top:0; left:0; }
#fader li { list-style-type:none; margin:0; padding:0; }
#fader li span { position:absolute; top:8px; left:8px; font-size:36px; font-weight:bold; 
                 opacity:0.0; filter:alpha(opacity=0); background-color:#2A2A2A; padding:0 8px; }
/* Can't use first-child selector because IE6 doesn't understand it */                 
#fader li.firstChild img { display:block; }
#fader li.firstChild span { display:block; opacity:0.50; filter:alpha(opacity=50); }
#faderLinks { position:absolute; left:-650px; top:0; padding:8px; background-color:#2A2A2A; border:solid 1px Black; opacity:0.90; filter:alpha(opacity=90); }

#montage { position:relative; margin:8px; height:400px; }
#montage img { position:absolute; display:none; border:solid 8px #2A2A2A; }

.slider { margin:8px 0; overflow:auto; text-align:center;}
.slider a img { text-decoration:none; }
.slider ul { list-style-type:none; margin:0; padding:0; white-space:nowrap; }
.slider li { list-style-type:none; margin:0 4px 4px 4px; padding:0; display:inline-block; vertical-align:middle; }
.slider img { display:block; margin:0 auto 4px auto; border:solid 4px #2A2A2A; }
body.ielt8 .slider { width:634px; overflow-x:scroll; overflow-y:visible; }
body.ielt8 .slider li { display:inline; width:200px; }

#chooser div.rcDark { height:208px; }
#chooser div.emptySlider,
#chooser div.waitingSlider,
#chooser div.loadedSlider { display:none; }
#chooser div.emptySlider,
#chooser div.waitingSlider { text-align:center; font-size:18pt; font-weight:bold; color:#EA972A; padding-top:60px; }
#chooser table.ftp, 
#chooser table.lmdc { width:100%; margin:8px 0 4px 0; font-size:12pt; font-weight:bold; text-align:center; }
#chooser table.ftp a, 
#chooser table.lmdc a { text-decoration:none; cursor:pointer; }
#chooser table.ftp img { border:4px solid #373737; }
#chooser div.chooserSort { text-align:right; margin:-4px 0 8px 0; }
body.ielt8 #chooser div.slider { width:618px; }

.whatsnewlistouter { margin:8px 0; }
.whatsnewlist { height:460px; overflow-y:scroll; padding-right:8px; }
.whatsnewitem { margin-bottom:8px; }
.whatsnewbody { margin-left:16px; }
.whatsnewlist .byline, .whatsnewitem .byline { margin:0; color:#297601; font-size:8pt; }
.whatsnewlist .catline, .whatsnewitem .catline { margin:0; color:#297601; font-size:8pt; }
.whatsnewlist .moreline { margin:-8px 0 0 0; color:#2A2A2A; text-align:right; }

/*==========================================================================*/
/*  Old styles for AI portal - to be deleted after transition to new skin.  */
/*==========================================================================*/

.RangePics td { text-align:center; vertical-align:top; }
.RangePics td img { border:none; }
.RangePics td p { margin-top:0px; margin-bottom:10px; }

.RMJCS_PreviousNext { text-align:center; font-size:11pt; margin:8px; }

/*========================================================*/
/*  RMJCS SiteMap styles for AI portal.                   */
/*========================================================*/

/* Outer UL only     */ ul.RMJCS_SiteMap { margin:8px 0 8px 1em; padding:0; }
/* inner ULs         */ ul.RMJCS_SiteMap ul { margin:0; padding:0; }
/* All LIs           */ ul.RMJCS_SiteMap li { margin:2px 0 2px 1em; list-style-type:disc; }
/* Descriptions       ul.RMJCS_SiteMap span { color:Gray; }*/
/* All nested red As */ ul.RMJCS_SiteMap a.notVisible { color:Red; font-weight:bold; }
/*                   */ ul.RMJCS_SiteMap a.redirect301, ul.RMJCS_SiteMap a.redirect302 { color:Blue; font-weight:bold; }
/*                   */ ul.RMJCS_SiteMap a.ignored { color:Gray; }

/*========================================================*/
/*  Styles for nav menu.                                  */
/*========================================================*/

/* ================================================================ 
This copyright notice must be kept untouched in the stylesheet at 
all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.stunicholls.com/menu/pro_drop_2.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */

/* Functional nav menu css. The height is functional because it works WITH the absolute positioning. */

div.RMJCS_Menu ul.level0 { height:30px; position:relative; z-index:1500; }
div.RMJCS_Menu li { display:block; float:left; }
div.RMJCS_Menu li.level0 { height:30px; }
div.RMJCS_Menu a { display:block; vertical-align:middle; }
div.RMJCS_Menu a.level0 { float:left; height:30px; line-height:30px; }
div.RMJCS_Menu a.level0 span { display:block; float:left; height:30px; }
div.RMJCS_Menu ul.level0 ul { position:absolute; z-index:1400; }
div.RMJCS_Menu ul.level1 li { position:relative; clear:both; }

/* Hide ULs off screen until they're unhidden by an LI hover. */
div.RMJCS_Menu ul.level0 ul, div.RMJCS_Menu ul.level0 li:hover ul ul, div.RMJCS_Menu ul.level0 li:hover li:hover ul ul, div.RMJCS_Menu ul.level0 li:hover li:hover li:hover ul ul, div.RMJCS_Menu ul.level0 li:hover li:hover li:hover li:hover ul ul { left:-9999px; top:-9999px; width:0; height:0; }

/* On top li hover position first sub UL below it's LI. */
div.RMJCS_Menu ul.level0 li:hover ul.level1 { left:0px; top:28px; width:auto; height:auto; }
/* On li hover re-position sub ULs to the right and slightly down from their LI. */
div.RMJCS_Menu ul.level0 li:hover li:hover ul, div.RMJCS_Menu ul.level0 li:hover li:hover li:hover ul, div.RMJCS_Menu ul.level0 li:hover li:hover li:hover li:hover ul, div.RMJCS_Menu ul.level0 li:hover li:hover li:hover li:hover li:hover ul { left:100%; top:-4px; width:auto; height:auto; }

/* Ensure hovered LIs remain below any sub ULs that may be shown 
   The height setting is required by IE7 to make the displayed UL appear above the hovered LI. */
div.RMJCS_Menu ul.level0 li:hover { position:relative; z-index:1200; height:auto; }


/* Make it pretty css. */
/* Make damn sure we're dealing with no funny spacing before we start. */
div.RMJCS_Menu ul, div.RMJCS_Menu li, div.RMJCS_Menu a, div.RMJCS_Menu span { padding:0; margin:0; border:0 transparent none; }
/* All LIs want no disc and no wrap. */
div.RMJCS_Menu li { list-style:none; white-space:nowrap; }

/* left padding on the top level a for the left part of the button image. */
div.RMJCS_Menu a.level0 { padding-left:20px; }
/* right padding on the top level span for the right part of the button image. */
div.RMJCS_Menu a.level0 span { padding-right:20px; }
/* Give a little top/bottom padding to the sub UL items. */
div.RMJCS_Menu ul.level1 a { padding-bottom:3px; }
/* Put the arrow on the fly links */
div.RMJCS_Menu ul.level1 a.hasSubMenu { padding-right:12px; background:url(images/nav_arrow.gif) no-repeat right center; }
/* Put some padding on all the sub menus. 
   IE doesn't get the right hand padding correct if the first item in the list isn't the widest. 
   We could use a left/right margin on the a but we don't want to mess with the size of the a because
      it will affect the li hence the 100% left positioning of child menus. */
div.RMJCS_Menu ul.level0 ul { padding:3px 8px 0 8px; }
/* Tell the top level spans to pick up the relevant pointer from it's parent a. 
   Required by Opera, IE8. */
div.RMJCS_Menu a.level0 span { cursor:pointer; text-decoration:inherit; }

div.RMJCS_Menu { font-weight:bold; }  

/* Style the top level backgrounds */
div.RMJCS_Menu a.level0 { background:url(images/menu_left.png) no-repeat 0 0; }
div.RMJCS_Menu a.level0 span { background:url(images/menu_separe.png) no-repeat right 0; }

/* Style the link text with the pseudo classes */
div.RMJCS_Menu ul.level0 a, div.RMJCS_Menu ul.level0 a:link, div.RMJCS_Menu ul.level0 a:active, div.RMJCS_Menu ul.level0 a:visited { color:#F0F0F0; text-decoration:none; }

/* Style sub-menu items */
div.RMJCS_Menu ul.level0 ul { background-color:White; border:1px solid #BBBBBB; }
div.RMJCS_Menu ul.level1 a, div.RMJCS_Menu ul.level1 a:link, div.RMJCS_Menu ul.level1 a:active, div.RMJCS_Menu ul.level1 a:visited { color:#2A2A2A; }

/* Style the active hierarchy */
div.RMJCS_Menu ul.level0 a.active, div.RMJCS_Menu ul.level0 a.active:link, div.RMJCS_Menu ul.level0 a.active:active, div.RMJCS_Menu ul.level0 a.active:visited { color:#389F03; text-decoration:none; }

/* Apply hover styles last to override all previous rules */
div.RMJCS_Menu ul.level0 a:hover,
div.RMJCS_Menu ul.level1 a:hover,
div.RMJCS_Menu ul.level0 a.active:hover { color:#389F03; text-decoration:underline; }
