/* the main website */

/* this one fixes the annoying left/right shift (for centered pages) we get
   when moving from a short page (no scrollbar) to a long page (with scrollbar).
   Solution is to always display the scroll bar
*/
   
html { overflow-y:scroll; }

/* but we don't want to always display scroller for Login frame */
html.LoginArea { overflow-y: auto; }

/* ================================================================== */
/* Body                                                               */
/* ================================================================== */

/* set some table defaults */
table {border-collapse: collapse;}
table td {vertical-align: top;}

body.SmartsimsBody
{
    /*background-color:   rgb(228, 232, 235);*/
    background-color:   rgb(229, 230, 231);
    background-image:   url('/images/bg_sides.gif');
    background-repeat:  repeat-y;
    background-position: top center;
    
    /*
    background-color:   rgb(0, 0, 0);
    background-image:   url('/?action=img&type=jpg&name=SmartsimsWebsite/background-glb');
    */    
    /*
    background-color:   rgb(0, 0, 0);
    background-image:   url('/?action=img&type=gif&name=background-black01');
    background-image:   url('/?action=img&type=gif&name=background-blue02');
    background-image:   url('/?action=img&type=jpg&name=SmartsimsWebsite/background-blue01');
    background-image:   url('/?action=img&type=jpg&name=SmartsimsWebsite/background-blue03');
    background-repeat:  repeat;
    background-position: top left;
    */
    /*
    background-color:   rgb(202, 207, 213);
    background-image:   url('/images/graybg.png');
    background-repeat:  repeat-x;
    background-position: top left;
    */

    margin:             0 0 0 0;
    padding:            0 0 0 0;
    /*font-family:        Arial, Helvetica, sans-serif;*/
    font-family:        "Century Gothic","Trebuchet MS","Lucida Sans",Verdana,Arial,Helvetica,sans-serif;
    font-family:        Verdana,"Century Gothic","Trebuchet MS","Lucida Sans",Verdana,Arial,Helvetica,sans-serif;
    font-family:        Verdana,Arial,Helvetica,sans-serif;
    font-size:          10pt;
    color:              black;
    color:              #919191;
    color:              #A5A7AA;
    /* text on most recent front page .psd from Sasha */
    color:              #4A4A4A;
    /* text on most recent MB-Intro product page .psd from Sasha */
    color:              #6B6B6B;

    text-align:         center;
}        

div.body_wrapper
{
    display:            block;
    /* padding-left + padding-right + width should always leave a couple of buffer pixels
       away from the 900px wide center whitespace of the background graphic
       otherwise we get rounding errors on the left/right auto margins and the
       LHS border tends to overlap the background shadow.  That gives an obvious
       line break on short pages
       So in this case 822 + 38 + 38 = 898 */
    width:              822px;
    margin-bottom:      0px;
    margin-top:         0px;
    text-align:         left;
    background-color:   white;
    margin-left:        auto;
    margin-right:       auto;
    padding:            0;
    padding-left:       38px;
    padding-right:      38px;

    padding-top:        14px;
    padding-bottom:     20px;

    /* underlay the front page design image to make layout checking easier */
        /*        
    background-image:   url('/?action=img&type=png&name=SmartsimsWebsite/Webpage-96 Final3_900px_MiddleOnly');
    background-image:   url('/?action=img&type=png&name=SmartsimsWebsite/Webpage-96Home29April_900px_middle_only');
    background-repeat:  no-repeat;
    background-position: 10px 13px;
    */

    /* underlay the second level page design image to make layout checking easier */
      /*          
    background-image:   url('/?action=img&type=png&name=SmartsimsWebsite/Webpage-96Inside3_900pxwideB_MiddleOnly');
    background-image:   url('/?action=img&type=png&name=SmartsimsWebsite/Webpage-96Inside22april_900px_MiddleOnly');
    background-image:   url('/?action=img&type=png&name=SmartsimsWebsite/Webpage-96Inside30april_900px_middle_only');

    background-repeat:  no-repeat;
    background-position: 10px 11px;
        */    


/* Need position: relative to get absolute layout to work relative
   to our centered block rather than left edge of page.
   Need overflow hidden to clip absolutely positioned images */
    position:       relative;
    /* we no longer have that product box DVD going right to the edge, so remove clipping
       that lets the RHS menu display... */
    overflow:       hidden;
    /*
        Can get away without visible overflow if right most menu item does not expand eg. 'Contact Us'
    overflow:       visible;
    */
    /* bizarre - need a border to avoid extra white space inserted at top in Firefox, Webkit browsers
       when we have visible overflow... very weird...
       IE7 not affected...
       Can't figure out why... something must be overflowing the bounds...
    */
    /*
    border:         1px solid white;
    */
}

body.FrontPage div.body_wrapper
{
    /* mark III look - lets make the front page wider without changing the second level page
       total width still 900px, lets just use a bit more of the area for the product boxes etc. */
    /*  Mark III */
    width:              826px;
    padding-left:       36px;
    padding-right:      36px;

      /*  Mark III look background image underlay */
    /*
    background-image:   url('/?action=img&type=png&name=SmartsimsWebsite/NEWWEBOption4_middle');

    background-repeat:  no-repeat;
    background-position: 0 0;
    */

}

div.mockupWarning
{
    position:       absolute;
    left:           700px;
    top:            20px;
    font-family:    Arial, sans-serif;
    font-size:      10pt;
    color:          black;
}

div.PageBanner, div.PageTopMenu, h1, h2, h3, a:link, a:visited
{
    color:              #138ACB;
    color:              #005FAD;
}

a
{
    text-decoration:    none;
}

a:hover
{
    text-decoration:    underline;
    color:              blue;
}

a img
{
    border:             none;
}

div.Motto_Text2
{
    font-family:        Arial;
    font-style:         italic;
    font-weight:        normal;
    font-size:          9pt;
    position:           absolute;
    top:                27px;
    left:               255px;
    color:              #301A6C;

    /*  or... try positioning it on the blue bar */
    color:              white;
    font-weight:        bold;
    top:                52px;
    left:               90px;
}

span.Motto
{
    padding:            0 0 0 0;
    margin:             0 0 0 0;
}

div.PageTopMenu, div.PageFooter
{
    font-size:          15px;
    font-size:          11pt;
    font-size:          10pt;
    text-align:         center;
    /*text-transform:     uppercase;*/
    /*font-family:        Verdana,Arial;*/
    margin-bottom:      0px;
    margin-right:       0px;
}

div.PageTopMenu
{
    text-align:         right;
}

div.PageFooter
{
    font-size:          13px;
    font-size:          11px;
    margin-top:         10px;
    line-height:        150%;
}

div.PageFooter a
{
    margin-left:        15px;
    margin-right:       15px;
}

span.TopMenu
{
    margin-left:       15px;
    padding-left:       5px;
    padding-right:      5px;
}

span.TopMenuLeft
{
    margin-right:       15px;
    float:              left;
}

span.TopMenu:hover, span.TopMenu a:hover, span.TopMenuLeft:hover, span.TopMenuLeft a:hover
{
	cursor:					pointer;
    background-color:       #F5F4F3;
    color:                  #A5A7AA;
    text-decoration:        none;
}


/*  Rework for Dennis  */

div.body_wrapper
{
    margin-top:             0px;
    padding-top:            0px
}

div.PageBanner
{
    position:       relative;
    left:           -39px;
    position:           absolute;
    left:            1px;
    background-image:   url('/images/newheaderbar_2009.jpg');
    width:  898px;
    height: 71px;
    z-index:        0;
}

img.PageBanner
{
    position:           absolute;
    left:            1px;
    position:       relative;
    left:           -39px;
    width:  898px;
    height: 71px;
}

div.PageTopMenu
{
    position:               absolute;
    top:                    44px;
    position:               relative;
    top:                    -22px;
    top:                    50px;
    top:                    52px;
    z-index:                2;
    padding-right:          0px;
}

div.PageTopMenu, div.PageTopMenu a:link, div.PageTopMenu a:visited
{
    text-transform:     uppercase;
    font-family:        Arial,Verdana;
    font-size:          11pt;
    font-size:          9pt;
    color:                  white;
    font-weight:            bold;
}

span.TopMenu:hover, span.TopMenu a:hover, span.TopMenuLeft:hover, span.TopMenuLeft a:hover
{
    background-color:       #F5F4F3;
    color:                  #A5A7AA;
    color:                  black;
    color:                  #7A3E76;
}






/*  Nick 4 June 2009 - trying out CSS menus...  */

ul.PageTopMenu
{
    color:              #138ACB;
}

ul.PageTopMenu
{
    display:            block;

    font-size:          15px;
    font-size:          11pt;
    font-size:          10pt;
    text-align:         center;
    margin-bottom:      0px;
    margin-right:       0px;
}

ul.PageTopMenu
{
    text-align:         right;
}

ul.PageTopMenu
{
    position:               relative;
    top:                    42px;
    z-index:                2;
    z-index:            1000;
    padding-right:          0px;

}

ul.PageTopMenu, ul.PageTopMenu a:link, ul.PageTopMenu a:visited
{
    text-transform:     uppercase;
    font-family:        Arial,Verdana;
    font-size:          11pt;
    font-size:          9pt;
    color:                  white;
    font-weight:            bold;
    text-decoration:        none;
}

li.TopMenu
{
    display:            block;
    position:          relative;
    float:              right;
    width:              auto;
    /*top:                -10px;*/
    top:                0px;
    list-style-type: none;
    color:              red;
        margin-left:       15px;
    padding-left:       5px;
    padding-right:      5px;
    border-left:        1px solid white;
/*    border-right:        1px solid white;*/
}

li.TopMenuLeft
{
    /*display:            inline;*/
    list-style-type: none;
    color:              red;
    margin-right:       15px;
    float:              left;
}
li.TopMenu a:visited, li.TopMenuLeft a:visited
{
    /*color: red;*/
}

ul.PageTopMenu li
{
    list-style-type: none;
}

ul.PageTopMenu ul
{
    display:            none;
    width:              auto;
    position:           absolute;
    top:                15px;
    top:                14px;
    left:               -75px;
    left:               0;
    /*border:             1px solid red;*/
    background-color:   blue;
    background-color:   #3890EC;
    background-color:   #6FA9C7;
    background-color:   #345DB4;
    background-color:   #3675CF;
    border:             1px solid black;
    /*
    -moz-border-radius-bottom: 	5px;
    -webkit-border-radius-bottom:  5px;
    */
    text-align:         left;
    padding-left:       5px;
    padding-right:      5px;
}

ul.PageTopMenu ul li
{
    width:              auto;
    width:              125px;
    width:              150px;
    margin-top:         7px;
    margin-bottom:      5px;
}

ul.PageTopMenu li.TopMenu:hover ul
{
    display:            block;
}
/*
ul.PageTopMenu li.TopMenu:hover ul:hover
{
    display:            block;
}
*/

ul.PageTopMenu li ul a
{
    width:      140px;
    padding-left:   5px;
    padding-right:  5px;
    display:    block;
    text-transform:        none;
    text-decoration:        none;
}

ul.PageTopMenu a:hover, ul.PageTopMenu li ul a:hover
/*span.TopMenu:hover, span.TopMenu a:hover, span.TopMenuLeft:hover, span.TopMenuLeft a:hover*/
{
	cursor:					pointer;
    background-color:       #F5F4F3;
    color:                  #A5A7AA;
}



/* right - originally had problems floating ul to the right of a left floated image
       temporary solution was to increase right margin of all left floated images */

/*div.Dasp img.FlowLeft*/
.FlowLeft, img.FlowLeft
{
    float:               left;
    margin-right:       15px;
}

.FlowRight, img.FlowRight
{
    float:               right;
    margin-left:        15px;
}

div.CenterPhoto_Screenshots3
{
    position:           absolute;
    left:               36px;
    top:                82px;
    width:				618px;
    height:				275px;
    background-image:				url('/images/CenterPhoto_Screenshots3b.jpg');
    background-repeat:  no-repeat;
    z-index:            1;
}

div.CenterPhoto_Screenshots6
{
    position:           absolute;
    left:               410px;
    top:                82px;
    width:				235px;
    height:				252px;
    background-image:				url('/images/CenterPhoto_Screenshots6.jpg');
    background-repeat:  no-repeat;
    z-index:            1;
}

img.ProductPhotos
{
    margin-top:     13px;
    margin-top:     33px;
    position:       relative;
    left:           -82px;
    border:         0;
    /*margin-bottom:  10px;*/
    width:          867px;
    height:         180px;
    height:         160px;
}

/*div.Motto + h1*/
body.FrontPage h1
{
    width:              370px;
    font-size:          16pt;
    font-size:          21px;
    font-size:          18px;
    font-size:          16px;
    font-weight:        bold;
    line-height:        1.5em;
    margin-top:         13px;
    font-family:        "Century Gothic","Trebuchet MS","Lucida Sans",Verdana,Arial,Helvetica,sans-serif;

}

/*div.Motto + h1 + p*/
body.FrontPage p.FirstPara
{
    /*color:              #919191;*/
    width:              305px;
    font-size:          12pt;
    font-size:          15px;
    font-size:          12px;
    line-height:        160%;
    margin-bottom:      85px;
    /* try Mark III look... */
    margin-left:        20px;
    width:              320px;
}

/* was the class on the wrapper around login frame */
/*div.SmartsimsBody div.RightSpan*/
/*div#LoginArea,*/ iframe.RightLoginFrame
{
    position:           absolute;
    width:              235px;
    height:             150px;
    /* revised positioning */
    left:               635px;
    top:                106px;
    top:                86px;
    /*
    padding:            0;
    margin:             0;
    */
    background-color:   transparent;
    z-index:            0;
}

div.FrontPageNews
{
    position:           absolute;
    top:                267px;
    top:                247px;
    left:               665px;
    width:              180px;
    height:             75px;
    border-left:        2px solid #E2E2E2;
    border-bottom:      2px solid #E2E2E2;
    background-color:   #EEF2F9;
    padding:            7px 7px 7px 7px;
    -moz-border-radius: 	5px;
    -webkit-border-radius:  5px;
    /* if we want a scrollable region */
    /*overflow-y:          auto;*/
    /* but we don't */
    overflow:           hidden;

    /* Mark III look */
    background-color:   white;
    border:             1px solid #CCDFEF;
    left:               670px;
    width:              175px;
    padding-right:      2px;
    width:              180px;
}

div.FrontPageNews h3
{
    font-size:          12px;
    /*text-transform:     uppercase;*/
    font-family:        "Century Gothic","Trebuchet MS","Lucida Sans",Verdana,Arial,Helvetica,sans-serif;
}

div.FrontPageNews ul
{
    list-style-position:   outside;
    padding-left:       0px;
    margin-left:        15px;
    margin-top:         0px;
}
div.FrontPageNews li
{
    color:              #919191;
    font-size:          10px;
    font-size:          9px;
    margin-bottom:      4px;
}

div.FrontPageNews ul a:link, div.FrontPageNews ul a:visited
{
    color:              #919191;
}

div.FrontPageNews ul a:hover
{
    text-decoration:    underline;
    color:              gray;
}


div.ProdInfo
{
    margin-top:         15px;
    width:              177px;
    width:              180px;
    padding-right:      30px;
    float:              left;
    /*border:             1px solid red;*/
    background-image:   url('/images/prodInfo_background.jpg');
    background-repeat:  no-repeat;

    /* Mark III */
    padding-left:       10px;
    width:              170px;
    height:             190px;
}

div.ProdInfo[type="racingbike"]
{
    background-image:   url('/images/prodInfo_background_racebike.jpg');
}

div.ProdInfo[type="introbike"]
{
    background-image:   url('/images/prodInfo_background_introbike.jpg');
}

div.ProdInfo[type="mp3player"]
{
    background-image:   url('/images/prodInfo_background_mp3player.jpg');
}

div.ProdInfo[type="camera"]
{
    background-image:   url('/images/prodInfo_background_camera.jpg');
}

div.ProdInfo p + a
{
    font-size:          8pt;
}


div.ProdInfoRight
{
    width:              170px;
    padding-right:      0;
    padding-right:      15px;
}

div.Dasp div.ProdInfo
{
/*    float: none;*/
    position:           relative;
    left:               -15px;
}

div.Dasp div.ProdInfo p
{
    font-size:          8pt;
}

/*div.ProdInfo*/ h2
{
    /*text-transform:     uppercase;*/
    font-size:          21px;
    font-size:          18px;
    font-size:          14px;
    font-weight:        normal;
    padding-bottom:     0;
    margin-bottom:      0;
    font-family:        "Century Gothic","Trebuchet MS","Lucida Sans",Verdana,Arial,Helvetica,sans-serif;
}

div.ProdInfo h2
{
    font-size:          14px;
    margin-bottom:      5px;
}

/*div.ProdInfo*/ h3
{
    font-size:          15px;
    font-size:          13px;
    font-size:          12px;
    font-weight:        normal;
    padding-top:     0;
    margin-top:      0;
    margin-bottom:      6px;
    line-height:       135%;
    font-family:        "Century Gothic","Trebuchet MS","Lucida Sans",Verdana,Arial,Helvetica,sans-serif;
}

div.ProdInfo h3
{
    font-size:          14px;
}

div.BottomBlock h3
{
    font-size:          14px;
}

div.ProdInfo p
{
    font-size:          13px;
    font-size:          12px;
    margin-top:         0;
    margin-bottom:      0;
    /* Mark III */
    font-size:          8pt;
}

div.BottomBlock
{
    margin-top:         20px;
    background-color:   #EEF2F9;
    padding-left:       20px;
    padding-right:      20px;
    padding-top:        20px;
    padding-bottom:     10px;
    border-left:        3px solid #E2E2E2;
    border-bottom:      3px solid #E2E2E2;
    /*border-radius:      10px;*/
    -moz-border-radius: 	10px;
    -webkit-border-radius:  10px;
    /*border:             1px solid black;*/
    /*height:             500px;*/
    display:            block;
}
div.LeftColumn
{
/*    display:            inline;*/
    float:              left;
    width:              372px;
    /*border:             1px solid red;*/
    padding:            0;
}
div.RightColumn
{
    /*display:            inline;*/
    float:              right;
    width:              372px;
    /*border:             1px solid green;*/
    padding:            0;
}


/* ================================================================== */
/* Second Level Pages													  */	
/* ================================================================== */



/* ================================================================== */
/* Form Selector													  */	
/* ================================================================== */

div.SelectionDiv
{
	overflow:				auto;
	max-height:				20em;
	text-align:				left;
}

/* ================================================================== */
/* Menu Row															  */	
/* ================================================================== */

/*Use instead of RHS*/
/*Think about using Dasp for dynamic content area...*/
div.SmartsimsBody div.CenterSpan
{
}

div.UnderLeftMenu
{
    position:   absolute;
    width:      180px;
    top:        550px;
    left:       0px;
}

div.UnderLeftMenuHardLeft
{
    position:   absolute;
    width:      180px;
    top:        550px;
    left:       -35px;
}

div.LeftMenu
{
    width:              180px;
    width:              175px;
    float:              left;
    text-align:         left;

    padding-top:        50px;
    padding-top:        35px;
    padding-top:        10px;
    padding-top:        20px;

    background-color:       transparent;
}

/* try this technique to get the LHS menu shading without having to make the div go full height */
div.SmartsimsBody
{
    margin-top:         20px;
    /* for Dennis */
    margin-top:         65px;

    background-image:   url('/images/LHSMenuBackground.png');
    background-repeat:  repeat-y;
    background-position: 0px 0px;
    background-position: -15px 0px;
    padding-top:        0px;
    /*  AAAAAAGH - DIE IE7 - DIE DIE DIE!!!!
        The background image only positions and draws correctly behind LeftMenu div if we draw a border */
    border:     1px solid white;
}

div.LeftMenuSection
{
    color:              black;
    font-weight:        bold;
    text-transform:    uppercase;
    margin-top:         15px;
    margin-bottom:      10px;
}

div.MenuRow
{
    /*margin-left:        25px;*/
    margin-top:         16px;
    margin-bottom:      10px;
    margin-bottom:      5px;
    font-size:          11pt;
    font-size:          15px;
    font-size:          14px;
    font-size:          12px;
    /*letter-spacing:     3px;*/
    /*font-weight:        bold;*/
    margin-left:        0px;
    padding-left:       7px;
    padding-right:      7px;

    /* lets tighten up the gaps a bit... */
    margin-top:         6px;
    padding-top:        2px;
    padding-bottom:     2px;
}

div.MenuRow[depth='2']
{
    margin-left:      20px;
    margin-left:      16px;
}

div.LeftMenu img
{
    border:     none;
}

div.MenuRow
{
	cursor:					pointer;
}

div.MenuRow:hover
{
        background-color:       #F5F4F3;
        background-color:       #138ACB;
        color:                  white;
}

div.MenuRow span
{
	cursor:					pointer;
}


/* ugh... need more CSS to make unopened divs turn red when you mouseover 
   if they don't have an anchor wrapped around them */

div.MenuRow a:link, div.MenuRow a:visited, div.MenuRow[open='0'] span
{
    color:              #A5A7AA;
    text-decoration:    none;
}

div.MenuRow:hover span
{
    color: white;
}

div.MenuRow[type='image']:hover
{
        background-color:       inherit;
        background-color:       transparent;
        cursor:                auto;
}



div.MenuRow[open='1']
/* 29 July 2010 and do the same for the links when MenuRow is open now that we put links in too */
div.MenuRow[open='1'] a:link, div.MenuRow[open='1'] a:visited, div.MenuRow[open='1'] span
{
    color:              #138ACB;
}

div.MenuRow[open='1']:hover span
{
    color: white;
}



/* login system... */
div.MenuLabel
{
	padding-left:			6px;
	padding-top:			3px;
	padding-bottom:			3px;
	padding-right:			2px;
	right:					0px;
}

div.MenuLabel span
{
	color:					blue;
	font-size:				14px;
	font-size:				12px;
	font-weight:			bold;
}


/* get rid of the border that an anchor adds to each image by default */
a.MenuRow img
{
    border-width:           0px;
}

/* New Look */
a.MenuRow:active, a.MenuRow:hover, a.MenuRow:link, a.MenuRow:visited
{
    background-image:       none;
}

/* ================================================================== */
/* Login Area														  */	
/* ================================================================== */

body.LoginArea
{
	background-color:		transparent;
    font-family: 			Verdana, Arial, Helvetica, sans-serif; 
	font-size:				10px;
        text-align:                     right;
}

body.LoginArea
{
    color:              #1386C8;
}

body.LoginArea div.LoginBlock 
{
	/*height:					2.2em;*/
        margin-bottom:                          8px;
}

body.LoginArea div.LoginErrorMsg 
{
	color:             red;
}

body.LoginArea div.LoginBlock label.LoginLabel 
{
	/*width:					5em;*/
	/*float:					left;*/
	font-size:				12px;
	margin-top:				3px;
        color:                                  #138ACB;
        margin-right:                           10px;
}

body.LoginArea div.LoginBlock input.LoginInput 
{
	font-size:				11px;
	/*clear:					left;*/
        border:                                 2px solid #B1D0ED;
        width:                                  95px;
        padding-left:                           5px;
        padding-right:                          5px;
        padding-top:                            1px;
        padding-bottom:                         1px;

}

body.LoginArea div.MenuLabel
{
        background-color:                       #1386C8;
        padding-right:                          15px;
}
body.LoginArea div.MenuLabel span
{
        color:                                  white;
}

body.LoginArea div.LoginBlock input[type='submit']/*, body.LoginArea div.MenuRow*/
{
	cursor:					pointer;
        background-color:                       #B1D0ED;
        background-color:                       #1386C8;
        color:                                  white;
	font-weight:			bold;
        font-size:                              11px;
        padding-top:                            2px;
        padding-bottom:                            2px;
            -moz-border-radius: 	5px;
            -webkit-border-radius: 	5px;
        margin-right:                   62px;

}

span.LoginButton, span.LogoutButton, span.LoginCourse, span.LoginCourseDouble
{
    position:           relative;
    display:            block;
    float:              right;
    margin-right:       44px;
    margin-right:       58px;
    padding:            0;
    border:             0;
    color:              white;
    font-family:        Verdana,Arial,Helvetica,sans-serif;
    font-size:          11px;
    font-weight:			bold;
    /*background-color:   #009FE2;*/
    /* CSS Sprites */
    background-image:   url('/images/bluebuttons.png');
    background-repeat:  no-repeat;
    height:             20px;
    padding-top:        3px;
    padding-left:       6px;
    padding-right:      5px;
    text-align:         center;
    width:              42px;
    background-position: -30px -465px;
    line-height:        150%;           /* make sure wrapped lines disappear */
    overflow:           hidden;
    cursor:            pointer;
}

span.LogoutButton
{
    background-position: -30px -420px;
    width:              59px;
    width:              49px;
    margin-right:       0px;
}

span.LoginCourse
{
    background-position: -30px -375px;
    width:              139px;
    /* make wider - request from Ian */
    width:              182px;
    margin-right:       0px;
    margin-bottom:      3px;
}

span.LoginCourseDouble
{
    background-position: -30px -510px;
    width:              182px;
    margin-right:       0px;
    margin-bottom:      3px;
    height:             38px;
}

span.LoginButton:hover, span.LogoutButton:hover, span.LoginCourse:hover, span.LoginCourseDouble:hover
{
    color: yellow;
}


/*
body.LoginArea div.LoginBlock input[type='submit']:active
{
        background-color:       green;
}
*/

body.LoginArea div.MenuRow
{
        /*background-color:                       #B1D0ED;*/
	text-align:				center;
}

body.LoginArea div.MenuRow
{
        margin-right:                   0px;
        margin-left:                    30px;
        border-left:                    2px solid grey;
        border-bottom:                  2px solid grey;
        height:                         auto;
        margin-bottom:  2px;
        margin-top:  5px;
}

body.LoginArea div.MenuRow:hover
{
        color:          red;
        color:          yellow;
}
/*
body.LoginArea div.MenuRow[depth='2'], body.LoginArea div.MenuRow IE6Depth2
{
        margin-left:                    30px;
}
*/

body.LoginArea div.MenuRow[depth='3'], body.LoginArea div.MenuRow IE6Depth3
{
        margin-left:                    140px;
}


body.LoginArea div.MenuRow, body.LoginArea div.MenuRow span
{
        border:                                 0;
        text-align:                             right;
        font-size:                              10px;
        color:                                  gray;
}

body.LoginArea div.MenuRow:hover span
{
    color:      white;
}

body.LoginArea div.MenuRow
{
        padding-right:                          20px;
}



body.LoginArea div.LoggedInAs
{
	text-align:				center;
}

body.LoginArea div.LoggedInAs span
{
	color:					blue;
	font-size:				14px;
	font-weight:			bold;
}

/*
turn off temporarily whilst playing around with Phoenix portal
body.LoginArea span.ButtonBackgroundBlue
{
	float:			        right;
}
*/


body.LoginArea div.Header
{
    color: 					Blue;
    font-family: 			Verdana, Arial, Helvetica, sans-serif; 
    font-size: 				12px; 
	font-weight:			bold;
    border-bottom: 			1px solid olive; 
	padding-top:			2px;
	padding-bottom:			2px;
}

/* ================================================================== */
/* Dasp                                                               */
/* ================================================================== */


div.Dasp
{
    width:              585px;
    width:              615px;
    width:              605px;
    width:              620px;
    float:              right;
    padding-left:       20px;
    padding-right:      20px;
    padding-left:       0px;
    padding-right:      0px;

    padding-top:        0px;

    /* javascript system - hide by default... */
    display:				none;

    padding-top:        15px;

}
div.Dasp p, div.Dasp ul
{
    line-height:        140%;
    font-size:          10pt;
    font-size:          15px;
    font-size:          14px;
    font-size:          12px;
}
div.Dasp ul
{
    margin-left:        0;
    padding-left:       15px;
}
div.Dasp li
{
    margin-bottom:       15px;
}
div.Dasp h1
{
    font-size:          16pt;
    font-size:          14pt;
    font-size:          12pt;
    font-size:          16px;
    font-weight:        bold;
    line-height:        150%;
    margin-top:         5px;
    padding-top:        0px;
    margin-bottom:      20px;
    margin-bottom:      15px;
    /* make sure this appears in front of the dvd product box */
    position:           relative;
    z-index:    2;
    font-family:        "Century Gothic","Trebuchet MS","Lucida Sans",Verdana,Arial,Helvetica,sans-serif;
}

/* Lets try the new product logos */
div.ProductPageHeader
{
    width:      644px;
    height:     193px;
    display:    block;
    border:     0;
    padding:    0;
    position:       relative;
    top:        -8px;
    left:       -20px;
}

div.ProductPageHeader img
{
    border:             none;
}

div.ProductPageHeader h1
{
    margin:             0;
    padding:            0;
    position:           absolute;
    left:               236px;
    top:                73px;
    left:               17px;
    top:                0px;
    font-size:          22pt;
    font-family:        "Century Gothic","Trebuchet MS","Lucida Sans",Verdana,Arial,Helvetica,sans-serif;
    color:              white;
}

div.ProductPageHeader h1 span
{
    font-weight:        normal;
}

div.ProductPageHeader p
{
    margin:             0;
    padding:            0;
    position:           absolute;
    display:            block;
    width:              260px;
    left:               145px;
    top:                60px;
    color:              black;
    font-family:        "Century Gothic","Trebuchet MS","Lucida Sans",Verdana,Arial,Helvetica,sans-serif;
    font-size:          9pt;
    line-height:        175%;
}

div.ProductPageHeader[type='MBI'] p
{
    left:               125px;
    width:              270px;
    line-height:        165%;
}

div.ProductPageHeader[type='MBA'] p
{
    font-size:          8.5pt;
}

div.ProductPageHeader a
{
    position:           absolute;
    font-family:        "Century Gothic","Trebuchet MS","Lucida Sans",Verdana,Arial,Helvetica,sans-serif;
    left:               240px;
    top:                169px;
    color:              #005FAD;
    font-size:          9pt;
}

div.Dasp div.LeftColumn h2, div.Dasp h2
{
    /*color: black;*/
    font-size: 10pt;
    font-size: 15px;
    font-size: 13px;
    text-transform:     none;
    font-family:        "Century Gothic","Trebuchet MS","Lucida Sans",Verdana,Arial,Helvetica,sans-serif;
}
div.Dasp div.LeftColumn
{
    float:  left;
    width:  370px;
    width:  420px;
}
div.Dasp div.RightColumn
{
    float:  right;
    width:  200px;
    width:  170px;
}


div.Dasp[open='1']
{
	display:				block;
}

/*  Used by the 404 error page
    put this here rather than in IE6 styles just in case
    some other browsers also ignore attribute selectors */
div.IE6HackOpen
{
    display:				block;
}

div.Dasp img.FlowLeft
{
	float:					left;
    /* hack - having problems floating ul to the right of a left floated image
       temporary solution is to increase right margin of all left floated images */
    margin-right:           20px;
}

div.Dasp img.FlowRight
{
	float:					right;
    margin-left:           10px;
}

div.Dasp table.Brochure
{
	border:					1px solid black;
	padding:				0;
	/*cell-spacing:			0;*/
	font-size:				11px;
	font-size:				11px;
}

div.Dasp table.Brochure tr
{
}

div.Dasp table.Brochure th
{
	background-color:		#dddddd;
	text-align:				center;
	font-weight:			bold;
	border:					1px solid black;
}

div.Dasp table.Brochure td
{
	border:					1px solid black;
}

/* ================================================================== */
/* Dasp Form                                                          */
/* ================================================================== */

div.Dasp form h3
{
	font-size:				12px;
}

div.Dasp form
{
	text-align:				left;
}

div.Dasp form h3, 
div.Dasp form span, 
div.Dasp form label, 
div.Dasp form input, 
div.Dasp form textarea
{
	font-size:				11px;
}

div.Dasp form div,
div.Dasp form h3
{
	clear:					both;
}

div.Dasp form span
{
	float:					left;
	min-width:				200px;
        margin-bottom:                          5px;
}

div.Dasp form label
{
	float:					left;
	min-width:				100px;
}

div.Dasp form input[type="text"]
{
	float:					left;
}

/* Bloody IE7 does not support :after */
/* We can probably get a similar effect using background-image / background-position */
/* Problem is that 'content' is not supported by IE6 / 7 - and only for before/after on Firefox */
/* Would be nice to avoid background images... */
/* Will have to inline I think... */
div.Dasp form label.Required:after
{
	color:					Red;
	font-weight:			bold;
	font-size:				14px;
	content:				" * ";
}
 
div.Dasp form h3.Required:after
{
	color:					Red;
	font-weight:			bold;
	font-size:				14px;
	content:				" * ";
}
 
/* ================================================================== */
/* Dasp Selector                                                      */
/* ================================================================== */

div.Dasp div.SectionSelector
{
	height:					3em;
}

div.Dasp div.SectionSelector label
{
	font-weight:			bold;
}

div.Dasp div.Element
{
	display:				none;
}

div.Dasp div.Element[open='1']
{
	display:				block;
}

div.Dasp div.ElementSelector
{
	height:					13em;
	overflow:				auto;
	border:					1px solid grey;
}

/* if we have a SectionSelector then reduce size accordingly */
div.Dasp div.SectionSelector div.Element div.ElementSelector
{
	height:					10em;
}

div.Dasp div.ElementSelector div
{
	border-bottom:			1px solid lightgrey;
	color:					#336699;
	font-size:				12px;
	font-weight:			bold;
	cursor:					pointer;
	padding-left:			4px;
	padding-right:			4px;
	padding-top:			1px;
	padding-bottom:			1px;
}

div.Dasp div.ElementSelector div[open='1']
{
	color:					#0066FF;
}

div.Dasp div.ElementDisplay
{
	position:				absolute;
	top:					14em;
	bottom:					4px;
	right:					1em;
	left:					1em;

	margin-top:				0.5em;
	margin-left:			0.5em;
	margin-right:			0.5em;

	overflow:				auto;

	padding-top:			4px;
	padding-left:			10px;
	padding-right:			10px;
	padding-bottom:			4px;

	border-top:				1px solid grey;
	border-left:			1px solid grey;
	border-right:			3px solid darkgrey;
	border-bottom:			3px solid darkgrey;
}

div.Dasp div.ElementDisplay > div
{
	padding:				12px;
	display:				none;
}

div.Dasp div.ElementDisplay > div[open='1']
{
	display:				block;
}

div.Dasp div.ElementDisplay h2
{
	font-size:				16px;
	color:					Red;
}

div.Dasp div.ElementDisplay h3
{
	font-size:				16px;
	color:					Green;
}

div.Dasp div.ElementDisplay h2 + div, div.Dasp div.ElementDisplay a
{
	font-size:				14px;
	font-weight:			bold;
}

div.Dasp div.ElementDisplay p 
{
	font-size:				14px;
}


/* ================================================================== */
/* Footer                                                             */
/* ================================================================== */


/* ================================================================== */
/* Notes and Notices                                                  */
/* ================================================================== */

div.BottomNote
{
	display:				none;
	position:				fixed;
	bottom:					24px;
	width:					240px;
	height:					380px;
	left:					33%;
	border-top:				4px solid grey;
	border-left:			4px solid grey;
	border-right:			2px solid black;
	border-bottom:			1px solid black;
	background-color:		white;
	background-repeat:      no-repeat;
    /* If I want the cool background effect AND close cross I'll have to stick another div in here */
	/*background-image:		url('/?action=img&type=jpg&name=portal/BG_fadeblue');*/
    background-image:		url('/images/closecross.jpeg');
    /*background-position:    97% 3%;*/
    /* leave enough buffer for the vertical scrollbar if it displays */
    background-position:    93% 3%;
	overflow:				hidden;
	padding-top:			12px;
	padding-left:			40px;
	padding-right:			40px;
   	overflow:				auto;
}

/* New Look */
div.BottomNote
{
    background-color:		#F0F0F0;
}

div.BottomNote[open='1']
{
	display:				block;
}

div.BottomNote h2
{
    font-family:        "Century Gothic","Trebuchet MS","Lucida Sans",Verdana,Arial,Helvetica,sans-serif;
}

/* ================================================================== */
/* Mainsite                                                           */
/* ================================================================== */

div.Nag, div.LoginError
{
    /*position:               relative;*/
    margin-left:            40px;
    color:                  red;
}

.Indent
{
    margin-left:            40px;
}

div.LaunchWebApp
{
    margin-top:             10px;
    margin-left:            40px;
    margin-bottom:          10px;
}

span.AppLoginErrorMsg
{
    display:            block;
    margin-top:         10px;
    /*margin-left:        25px;*/
    background-color:		#F0F0F0;
    border:             1px solid black;
    -moz-border-radius: 	5px;
    -webkit-border-radius:  5px;
    padding:            10px 10px 10px 10px;
}

div.Downloads
{
    position:           relative;
    display:            block;
    /*background-image:   url('/?action=img&type=png&name=SmartsimsWebsite/button_download_green');*/
    background-image:   url('/images/button_download_green.png');
    background-repeat:  no-repeat;
    height:             55px;
    padding-top:        0px;
    padding-bottom:     0px;
    padding-left:       63px;
    margin-bottom:      10px;
}

div.Downloads label
{
    position:           absolute;
    top:                15px;
}

div.Downloads a, div.Downloads span
{
    position:           relative;
    top:                35px;
}

div.Resource, div.Headline
{
    position:           relative;
    display:            block;
    /*
    background-image:   url('/?action=img&type=png&name=SmartsimsWebsite/button_download_green');
    background-image:   url('/?action=img&type=png&name=SmartsimsWebsite/button_download_green_small');
    */
    background-image:   url('/images/button_download_green_small.png');
    background-repeat:  no-repeat;
    height:             55px;
    height:             26px;
    padding-top:        0px;
    padding-bottom:     0px;
    padding-left:       33px;
    margin-bottom:      10px;
    margin-left:        25px;
}

div.Headline
{
    margin-left:        inherit;
}

div.Resource a, div.Headline a
{
    position:           relative;
    top:                7px;
}

p.HeadlineDesc
{
    font-size: 8pt;
    margin-left:    33px;
}

div.BillingLink
{
    margin-left:            40px;
    margin-bottom:          5px;
    font-size:              8pt;
}


/* ======================================= */

/* Improving Product Pages */

img.ProductBox
{
    float:      right;
    border-left:    1px solid #DDDDDD;
    border-bottom:  1px solid #DDDDDD;
    padding-right:  0;
    margin-right:   0;
}

img.RHSPersonGirl
{
    /* stretch out of proportion */
    width:      180px;
    width:      181px;
    height:     326px;
    -ms-interpolation-mode: bicubic;
}

img.RHSPersonBusinessGuy
{
    /* stretch out of proportion */
    width:      180px;
    width:      180px;
    height:     250px;
    -ms-interpolation-mode: bicubic;
}

img.ProductFreeTrial
{
    position:   relative;
    left:       -10px;
    margin-bottom:    0px;
}

p.quote, blockquote
{
    margin-left:            40px;
    font-style:            italic;
    color:             #666666;
    font-size:              12px;
}

div.PhotoQuote
{
    color:              #138ACB;
    font-size:          15pt;
    font-size:          13pt;
    font-size:          14px;
    font-size:          12px;
    font-weight:        bold;
    font-weight:        normal;
    line-height:        160%;
    margin-bottom:      20px;
}

div.FreeSampleDownloads
{
    border:             2px solid #2693CF;
    -moz-border-radius: 	5px;
    -webkit-border-radius: 	5px;
    margin-top:         30px;
    margin-bottom:         30px;
    padding:            10px 0px 10px 10px;
}

div.FreeSampleDownloads h2
{
    margin-top:         0;
    margin-bottom:      5px;
    font-size:          14px;
    font-family:        "Century Gothic","Trebuchet MS","Lucida Sans",Verdana,Arial,Helvetica,sans-serif;
}

div.FreeSampleDownloads ul
{
    margin-top:         0;
    margin-bottom:      0;
    margin-left:        0;
    padding-left:       5px;
}

div.FreeSampleDownloads li
{
    list-style-type:	none;
    font-size:  15px;
    font-size:  13px;
    font-size:  12px;
    margin-bottom:  3px;
    color:              #138ACB;
}

div.FreeSampleDownloads a
{
    color:      #5E5E5E;
}

div.ProductThumb, div.ProductThumb2
{
	float:					right;
    margin-bottom:         15px;
    border:                1px solid black;
    clear:                  right;
    width:                  150px;
    text-align:             center;
}

div.ProductThumb2
{
    clear:                  none;
    margin-right:           20px;
    border:                 none;
    float:                  left;
}

div.UnderLeftMenu div.ProductThumb
{
        float:  left;
}

div.NoBorder
{
    border:                 none;
    padding-left:           5px;
    padding-right:          5px;
}

div.ProductThumbLeft
{
    float:                  left;
    margin-right:           25px;
    clear:                  left;
}

div.ProductThumb img
{
    border:                 none;
    max-width:              150px;
} 

div.ProductThumb span
{
    font-size:              8pt;
    /*color:                  red;*/
}

/*a.MenuRow:active, a.MenuRow:hover, a.MenuRow:link, a.MenuRow:visited*/

div.ProductThumb a:visited
{
    /*text-decoration: none;*/
}

div.PageIndex
{
}

div.PageIndex span
{
    display:        block;
    color:          black;
    font-weight:    bold;
}

div.PageIndex a
{
    margin-left:    20px;
    display:        block;
}

table.ProductPage
{
    border:         none;
 /*   padding:        0px 0px 0px 0px;
    margin:         0px 0px 0px 0px;*/
}

table.ProductPage td
{
    vertical-align: top;
}

td.ProductPageText
{
    padding-right:  20px;
}

td.ProductPageScreenShots
{
    padding-left:   10px;
    padding-right:  10px;
    text-align:     right;
}

div.FreeTrial
{
    text-align:     center;
}

div.FreeTrial span
{
    font-size:      15pt;
    font-size:      13pt;
    font-size:      12px;
    /*
    background-color:   red;
    color:          white;
    border:         1px solid black;
    padding:        5px;
    */
}


div.PreviewGroup
{
    position:       relative;
    /*float:          none;*/
    /*clear:          both;*/
    border:         1px solid red;
}

div.ProductPreview
{
    float:          left;
    /*border:         1px dotted black;*/
    width:          150px;
}

div.ProductPreview img
{
    max-height:         65px;
}

div.FrontPage div.CenterSpan a
{
	color:					#0066FF;
}

div.GettingStarted
{
    /* IE7 likes the Gray spelling, not Grey */
    /*
	border-top:			1px solid DarkGray;
	border-bottom:		1px solid DarkGray;
	border-left:		3px solid DarkGray;
	border-right:		3px solid DarkGray;
    background-color:		#F0F0F0;*/
	border-top:			1px solid DarkGray;
	border-bottom:		1px solid DarkGray;

    width:              auto;
	min-height:			4em;
    
    padding-left:       20px;
    padding-right:      20px;
    padding-bottom:     15px;

    font-size:          18px;
    font-size:          16px;
}

div.GettingStarted h3
{
	font-size:				15px;
	font-size:				13px;
	font-weight:			bold;
	color:					#0066FF;
}

div.GettingStarted ul
{
    font-weight:            bold;
}

div.GettingStarted ul a
{
    margin-left:        10px;
    margin-right:       10px;
    font-size:          larger;
	color:				#0066FF;
}

div.GettingStarted ul a img
{
    margin-left:        5px;
    margin-right:       5px;
    height:             50px;
}

body.FrontPage table.ProductOverview
{
    margin-top:         10px;
    padding-top:        10px;
    padding-bottom:        10px;
    border-top:         1px solid black;
    border-bottom:      1px solid black;
}

table.ProductOverview a img
{
    border:             1px solid black;
    border:             none;
}

table.ProductOverview th, table.ProductOverview td
{
    vertical-align:     top;
    width:              25%;
    padding-left:       5px;
    padding-right:      5px;
    text-align:         left;
}

body.FrontPage table.ProductOverview th, body.FrontPage table.ProductOverview td
{
    text-align:         center;
}

table.ProductOverview span
{
    font-size:          13px;
    font-size:          11px;
    font-weight:        bold;
    color:              #138ACB;
}

body.FrontPage table.ProductOverview span
{
    font-size:      15pt;
    font-size:      13pt;
}

table.ProductOverview ul
{
    margin-left:        15px;
    padding-left:       0px;
    line-height:        115%;
}

table.ProductOverview ul li
{
    font-size:          11px;
    font-size:          9px;
    margin-bottom:      7px;
}

table.ProductOverview ul li a
{
    font-size:          11px;
    font-size:          9px;
}

table.ProductOverview td a
{
    font-size:          11px;
    font-size:          9px;
	color:					#0066FF;
}

table.ProductOverview td.FreeTrial
{
    text-align:         center;
    padding-bottom:     10px;
}

table.FrontPageLayout
{
    margin:             0 0 0 0;
    padding:            0 0 0 0;
    border:             0;
    vertical-align:     top;
}

table.FrontPageLayout td
{
    vertical-align:     top;
}

table.FrontPageLayout td.FrontPageLayoutRight
{
    width:              230px;
}

/* ================================================================== */
/* Generic                                                            */
/* ================================================================== */

.Bold
{
    font-weight:        bold;
}

ul li
{
    margin-bottom:      10px;
}

ul.disc li
{
	list-style-type:	disc;
}

ul.circle li
{
	list-style-type:	circle;
}

ul.square li
{
	list-style-type:	square;
}

ul.Number li
{
	list-style-type:	decimal;
}

.ClearLeft
{
	clear:				left;
}

.ClearRight
{
	clear:				right;
}

.ClearLeftRight
{
	clear:				both;
}


/* ugh... can't mix attribute selectors with IE6 Hacks without duplicating everything... */
/* so lets just hide the attribute selectors for now... */

span.ButtonBackgroundBlue, span.IE6HackBBB200/*, span.ButtonBackgroundBlue[size='200']*/
{
    display:            block;
    padding:            0;
    border:             0;
    color:              white;
    font-family:        Arial,Verdana,Helvetica,sans-serif;
    font-size:          14px;
    text-align:         center;
    line-height:        150%;           /* make sure wrapped lines disappear - affects top spacing too though... */
    font-weight:			bold;
    /*    background-color:   #009FE2;  */
    /* CSS Sprites */
    /*
        background-image:   url('/?action=img&type=png&name=SmartsimsWebsite/bluebuttonsB_256');
    */
    background-image:   url('/images/bluebuttons.png');
    background-repeat:  no-repeat;
    height:             26px;
    padding-top:        4px;
    padding-left:       8px;
    padding-right:      7px;

    width:              185px;

    background-position: -30px -150px;
    overflow:           hidden;
    cursor:            pointer;
}

span.IE6HackBBB75 /*, span.ButtonBackgroundBlue[size='75']*/
{
    background-position: -30px -330px;
    /* width = graphic width - (padding-left + padding-right) */
    width:              60px;
}

span.IE6HackBBB100 /*, span.ButtonBackgroundBlue[size='100'] */
{
    background-position: -30px -285px;
    width:              85px;
}

span.IE6HackBBB125 /* , span.ButtonBackgroundBlue[size='125'] */
{
    background-position: -30px -240px;
    width:              110px;
}

span.IE6HackBBB150 /*, span.ButtonBackgroundBlue[size='150']*/
{
    background-position: -30px -195px;
    width:              135px;
}

span.IE6HackBBB200 /* , span.ButtonBackgroundBlue[size='200']*/
{
    background-position: -30px -150px;
    width:              185px;
}

span.IE6HackBBB250 /* ,span.ButtonBackgroundBlue[size='250']*/
{
    background-position: -30px -105px;
    /* note this instance is one pixel short :) nevermind... */
    width:              234px;
}

span.IE6HackBBB300 /* ,span.ButtonBackgroundBlue[size='300']*/
{
    background-position: -30px -60px;
    width:              285px;
}



span.ButtonBackgroundBlue:hover
{
    color: yellow;
}

div.Announcements
{
    /* IE7 likes the Gray spelling, not Grey */
	border-top:			1px solid DarkGray;
	border-bottom:		1px solid DarkGray;
	border-left:		3px solid DarkGray;
	border-right:		3px solid DarkGray;
    background-color:		#F0F0F0;

    width:              auto;
	min-height:			4em;
    
    padding-left:       20px;
    padding-right:      20px;
    padding-bottom:     15px;
}

/* New look - Ian / Sasha */
div.Announcements
{
    border:             0;
    background-color:   #F1F7FC;
    padding-left:       13px;
    padding-top:        10px;
    padding-bottom:     10px;
    padding-right:      13px;
    -moz-border-radius: 	5px;
    -webkit-border-radius:  5px;
}

div.Announcements ul
{
    padding-left:       35px;
}

div.SinglePlayerRego
{
    border-bottom:      1px solid DarkGray;
}




body.FrontPage h1, body.FrontPage p.FirstPara
{
    position:           relative;
    z-index:            2;
}

body.FrontPage h1
{
    margin-top:         0;
    padding-top:         78px;
    padding-top:         70px;

    /* try Mark III look... */
    padding-top:        75px;
    margin-left:        20px;
    width:              300px;
    font-size:          20px;
    font-size:          22px;
    font-weight:        normal;
}
body.FrontPage p.FirstPara
{
    /* try Mark III look... */
    margin-bottom:      15px;
}

body.Portal h1, body.Error404 h1
{
    padding-top:        75px;
}


/* Nick 21 Aug 2009
   Lets try sticking the dropdown menus at the bottom and using CSS to position them at the top... 
*/

div.PageBanner
{
    top:    0px;
}

ul.PageTopMenu
{
    left:                   0px;
    padding-left:           0px;
    margin-left:            0px;
    padding-right:          0px;
    margin-right:           0px;
    width:                  862px;
    width:                  855px;
    width:                  855px;
    position:               absolute;
}


/* Nick 3 Aug 2010 - any WYSIWYG css required to get TinyMCE laying out correctly */

body.mceContentBody, body.mceContentBody td
{
    font-family:        Verdana,Arial,Helvetica,sans-serif;
    font-size:          12px;
    line-height:        140%;
    color:              #6B6B6B;
}


/* Nick 1 Aug 2010 - add in reusable NewsStory CSS */

table.News_MWCScoreboard, table.News_DataTable {border-spacing: 0; border-collapse: collapse; font-size: 8pt; width: 100%;}
table.News_MWCScoreboard thead, table.News_DataTable thead {font-weight: bold; border: 1px solid black;}
table.News_MWCScoreboard td, table.News_DataTable td {vertical-align: top; 
				        padding-left: 5px; 
				        padding-right: 5px; 
				        margin-top: 0; 
				        margin-bottom: 0; 
				        padding-top: 5px; 
				        padding-bottom: 5px; 
				        border: 1px solid black;
                        font-size: 8pt;
				        }

table.News_MWCScoreboard td.Col1, table.News_MWCScoreboard td.Col3, td.News_HighlightCol
{
    font-weight: bold;
    background-color: #EDF4F9; 
}

table.News_MWCScoreboard td.Col3, table.News_MWCScoreboard td.Col4, table.News_MWCScoreboard td.Col5, table.News_MWCScoreboard td.Col6
{
    text-align: right;
}

table.News_MWCScoreboard td.Col3, table.News_MWCScoreboard td.Col4
{
    width:      50px;
}

table.News_MWCScoreboard td.Col5, table.News_MWCScoreboard td.Col6
{
    width:      75px;
}



table.News_PhotoTable
{
    width:      100%;
}

table td.News_PhotoCell { width: 150px; font-size: 8pt; vertical-align: top; padding-left: 20px; text-align: center; }
table td.News_PhotoCell_Left { width: 150px; font-size: 8pt; vertical-align: top; padding-right: 20px; text-align: center; }

table td.News_PhotoCell p, table td.News_PhotoCell_Left p { margin-top: 4px; font-size: 8pt; }


