/* root element for tabs  */
ul.tabs
{
    list-style: none;
    margin: 0 !important;
    padding: 0px;
    height: 35px;
    padding-left: 8px;
    background-image: url(../../_gfx2009/layout/box_plainheader.png);
    background-repeat: repeat-x;
}

/* single tab */
ul.tabs li
{
    float: left;
    text-indent: 0;
    padding: 0;
    margin: 0 !important;
    list-style-image: none !important;
}

/* link inside the tab. uses a background image */
ul.tabs a
{
    background: url(../../_gfx2009/tab/blue.png) no-repeat -420px 0;
    font-size: 11px;
    display: block;
    height: 30px;
    font-size: 14px;
    font-weight: bold;
    line-height: 30px;
    width: 134px;
    text-align: center;
    text-decoration: none;
    color: #333;
    padding: 0px;
    margin: 0px;
    position: relative;
    top: 4px;
}

ul.tabs a:active
{
    outline: none;
}

/* when mouse enters the tab move the background image */
ul.tabs a:hover
{
    background-position: -420px -31px;
    color: #fff;
}

/* active tab uses a class name "current". it's highlight is also done by moving the background image. */
ul.tabs a.current, ul.tabs a.current:hover, ul.tabs li.current a
{
    background-position: -420px -62px;
    cursor: default !important;
    color: #000 !important;
}

/* Different widths for tabs: use a class name: w1, w2, w3 or w2 */


/* width 1 */
ul.tabs a.s
{
    background-position: -553px 0;
    width: 81px;
}
ul.tabs a.s:hover
{
    background-position: -553px -31px;
}
ul.tabs a.s.current
{
    background-position: -553px -62px;
}

/* width 2 */
ul.tabs a.l
{
    background-position: -248px -0px;
    width: 174px;
}
ul.tabs a.l:hover
{
    background-position: -248px -31px;
}
ul.tabs a.l.current
{
    background-position: -248px -62px;
}


/* width 3 */
ul.tabs a.xl
{
    background-position: 0 -0px;
    width: 248px;
}
ul.tabs a.xl:hover
{
    background-position: 0 -31px;
}
ul.tabs a.xl.current
{
    background-position: 0 -62px;
}


/* initially all panes are hidden */
div.panes div.pane
{
    display: none;
}




/* the overlayed element */
div.overlay
{
    /* growing background image */
    background-image: url(../../_gfx2009/overlays/white.png); /* dimensions after the growing animation finishes  */
    width: 600px;
    height: 470px; /* initially overlay is hidden */
    display: none; /* some padding to layout nested elements nicely  */
    padding: 55px;
}

/* default close button positioned on upper right corner */
div.overlay div.close
{
    background-image: url(../../_gfx2009/overlays/close.png);
    position: absolute;
    right: 5px;
    top: 5px;
    cursor: pointer;
    height: 35px;
    width: 35px;
}


/* black */
div.overlay.black
{
    background: url(../../_gfx2009/overlays/transparent.png) no-repeat !important;
    color: #fff;
}

/* petrol */
div.overlay.petrol
{
    background: url(../../_gfx2009/overlays/petrol.png) no-repeat !important;
    color: #fff;
}

div.black h2, div.petrol h2
{
    color: #ddd;
}




.simple_overlay
{
    /* must be initially hidden */
    display: none; /* place overlay on top of other elements */
    z-index: 10000; /* styling */
    border: 3px solid #203c5c;
    background-color: #d9e3ef;
    width: 675px;
    min-height: 100px;
    -moz-box-shadow: 0 0 90px 5px #000;
    -webkit-box-shadow: 0 0 90px #000;
}
/* close button positioned on upper right corner */
.simple_overlay .close
{
    background-image: url(../../_gfx2009/overlays/close.png);
    position: absolute;
    z-index: 10;
    right: -15px;
    top: -15px;
    cursor: pointer;
    height: 35px;
    width: 35px;
}

.simple_overlay_crop
{
    /* must be initially hidden */
    display: none; /* place overlay on top of other elements */
    z-index: 10000; /* styling */
    border: 3px solid #203c5c;
    background-color: #d9e3ef;
    width: 950px;
    min-height: 600px;
    -moz-box-shadow: 0 0 90px 5px #000;
    -webkit-box-shadow: 0 0 90px #000;
}
/* close button positioned on upper right corner */
.simple_overlay_crop .close
{
    background-image: url(../../_gfx2009/overlays/close.png);
    position: absolute;
    z-index: 10;
    right: -15px;
    top: -15px;
    cursor: pointer;
    height: 35px;
    width: 35px;
}

.simple_overlay_crop_cheerleader
{
    /* must be initially hidden */
    display: none; /* place overlay on top of other elements */
    z-index: 10000; /* styling */
    border: 3px solid #203c5c;
    background-color: #d9e3ef;
    width: 600px;
    min-height: 400px;
    -moz-box-shadow: 0 0 90px 5px #000;
    -webkit-box-shadow: 0 0 90px #000;
}
/* close button positioned on upper right corner */
.simple_overlay_crop_cheerleader .close
{
    background-image: url(../../_gfx2009/overlays/close.png);
    position: absolute;
    z-index: 10;
    right: -15px;
    top: -15px;
    cursor: pointer;
    height: 35px;
    width: 35px;
}




/* the overlayed element */
.apple_overlay
{
    /* initially overlay is hidden */
    display: none; /* growing background image */
    background-image: url(../../_gfx2009/overlays/white.png); /*  		width after the growing animation finishes 		height is automatically calculated 	*/
    width: 640px; /* some padding to layout nested elements nicely  */
    padding: 35px; /* a little styling */
    font-size: 11px;
}

/* default close button positioned on upper right corner */
.apple_overlay div.close
{
    background-image: url(../../_gfx2009/overlays/close.png);
    position: absolute;
    right: 5px;
    top: 5px;
    cursor: pointer;
    height: 35px;
    width: 35px;
}



.facebox-overlay
{
    /* overlay is hidden before loading */
    display: none;
    z-index: 1000000; /* standard decorations */
    width: 400px;
    border: 10px solid #666; /* for modern browsers use semi-transparent color on the border. nice! */
    border: 10px solid rgba(82, 82, 82, 0.698); /* hot CSS3 features for mozilla and webkit-based browsers (rounded borders) */
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
}

.facebox-overlay div.inner
{
    padding: 10px;
    border: 1px solid #3B5998;
    background-color: #fff;
    font-family: "lucida grande" ,tahoma,verdana,arial,sans-serif;
}

.facebox-overlay h2
{
    margin: -11px;
    margin-top: -11px;
    margin-bottom: 0px;
    color: #fff;
    background-color: #6D84B4;
    padding: 5px 10px;
    border: 1px solid #3B5998;
    font-size: 20px;
}