﻿/*** SoccerVillageTeam Style Sheet ***/

/* Standard Reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
    font-family: Arial, Sans-Serif;
}

.u  { text-decoration: underline; }
.ol { text-decoration: overline; }
.strike { text-decoration: line-through; }
.us { text-decoration: underline line-through;}
.uo { text-decoration: underline overline; }
.uos { text-decoration: underline overline line-through;}
.i  { font-style: italic; }
.em { font-style: italic; }
.ob { font-style: oblique; }
.b  { font-weight: bold; }
.strong {font-weight: bold; }
.red { color: #F00;}

.ac { text-align: center; }
.ar { text-align: right; }
.al { text-align: left; }
.aj { text-align: justify; }

input.buttons 
{
    background-color:ButtonFace;
    color: #000000;
    font-size: 11px;
    border: solid 1px #666666;
}

input 
{
    font-size:11px;
    font-family: Arial;
}
.hidden {
    visibility: hidden;
    display: none;
}

.clearfloat {
    clear: both;
}   

body {
    background: #CCC url("images/bg-body-main.jpg") repeat-x;
}

#wrapper { /*border: dashed 1px #F00;*/

    margin: 0 auto;
    width: 775px;    
}

#header { /*border: dashed 1px #0F0;*/
    
    position: relative;
    clear: both;  
    width: 775px;
    height: 76px;
    background: #112756;
    border: solid 1px #6E7FA2;
}

#header .logo { /*border: dashed 1px #F0F;*/

    position: relative;
    float: left;
    width: 490px;
    height: 76px;
    background: #112756;
    color: #FFF;
}

#header .site-info { /*border: dashed 1px #F0F;*/

    position: relative;
    float: right;
    width: 285px;
    height: 76px;
    background: #FFF url("images/bg-header-site-info.gif") no-repeat;
    color: #000;
    text-align: center;
}

#header .site-info h1 {

    position:relative;
    top: 50px;    
    font-weight: bold;
    font-size: 13px;     
}

#main-menu {

    position: relative;
    /*margin-top: 10px;*/
    clear: both;
    width: 775px;
    height: 25px;
    border-top: solid 1px #FFF;
    border-left: solid 1px #000; /*#6E7FA2;*/
    border-right: solid 1px #000; /*#6E7FA2;*/
    background: #496CAC url("images/bg-menu.gif") repeat-x;
    text-align: center;
}

#main-menu .navigation {

    position: relative;
    margin: 0 auto;
    width: 467px;
    height: 25px;
    background: #D82518 url("images/bg-navigation-main.gif") repeat-x;   
}

#main-menu .navigation .left {
    position: relative;
    float: left;
    width: 5px;
    height: 25px;
    background: #496CAC url("images/bg-navigation-left.gif") no-repeat;
}

#main-menu .navigation .right {
    position: relative;
    float: right;
    width: 5px;
    height: 25px;
    background: #496CAC url("images/bg-navigation-right.gif") no-repeat;
}

#main-menu .navigation .buttons {
    position: relative;
    float: left;
    width: 457px;
    height: 25px;
    background: #D82518 url("images/bg-navigation-main.gif") repeat-x;
}

#main-menu .navigation .buttons .button {
    position: relative;
    float: left;
    height: 25px;
    color: #FFF;
    font-weight: bold;
    font-size: 12px;
    margin: 0 10px 0 10px;
}

#main-menu .navigation .buttons .button a {
    position: relative;
    top: 5px;
}

#main-menu .navigation .buttons .button a:link, #main-menu .navigation .buttons .button a:visited {
    font-weight: bold;
    color: #FFF;
    text-decoration: none;    
}
#main-menu .navigation .buttons .button a:hover, #main-menu .navigation .buttons .button a:active {
    font-weight: bold;
    color: #FF0;
    text-decoration: underline;
}

#main-menu .navigation .buttons .divider {
    position: relative;
    float: left;
    width: 5px;
    height: 25px;
    background: #D82518 url("images/bg-navigation-divider.gif") no-repeat;
}

.content { /*border: dashed 1px #FOF;*/

    position: relative;
    clear: both;
    width: 775px;
    background: #FFF;
    border: solid 1px #000;
    color: #000;
    font-size: 11px;
}
.content a:link, .content a:visited {
    color: #093B80;
    font-weight: bold;
    text-decoration: underline;
}
.content a:hover {
    color: #666;
    font-weight: bold;
    text-decoration: none;
}
.content a:active {
    color: #00F;
    font-weight: bold;
    text-decoration: underline;
}

.content h1 {
    margin: 10px 5px 10px 5px;
    font-weight: bold;
    font-size: 18px;
}
.content h2 {
    margin: 10px;
    font-weight: bold;
    font-size: 16px;
    text-indent: 1px;
    border-bottom: dotted 2px #666;
}
.content h3 {
    margin: 20px 10px 10px 15px;
    font-weight: bold;
    font-size: 14px;
}
.content h4 {
    margin: 5px 5px 5px 20px;
    font-weight: bold;
    font-size: 13px;
}
.content h5 {
    margin: 5px 5px 5px 20px;
    font-weight: bold;
    font-size: 11px;
}
.content .subtext {
    font-size: 10px;
}
.content p {
    margin: 5px 20px 5px 20px;
    font-size: 12px;
}

.content ul li {
    margin: 3px 30px 3px 50px;
    font-size: 12px;
}

.content .form-fields {
    width: 744px;
    margin: 0 auto;
}

.content .form-fields .register { /*border: dashed 1px #F00;*/
    width: 360px;
    float: left;
}
.content .form-fields .register .header {
    width: 360px;
    height: 25px;
    background: #122859 url("images/bg-blue-header-360.gif") no-repeat;
}
.content .form-fields .register .header h3{
    position:relative;
    top: 5px;
    left: 10px;
    margin: 0;
    font-weight: bold;
    font-size: 13px;
    color: #FFF;
}
.content .form-fields .register .main {
    width: 360px;
    border-top: solid 2px #666;
    background: #CCC url("images/bg-gray-strip-360.gif") repeat-y;
}
.content .form-fields .register .footer {
    width: 360px;
    height: 15px;
    background: #CCC url("images/bg-gray-footer-360.gif") no-repeat;
    background-position: bottom;
}

.content .form-fields .login { /*border: dashed 1px #F00;*/
    width: 360px;
    float: right;
}
.content .form-fields .login .header {
    width: 360px;
    height: 25px;
    background: #122859 url("images/bg-blue-header-360.gif") no-repeat;
}
.content .form-fields .login .header h3{
    position:relative;
    top: 5px;
    left: 10px;
    margin: 0;
    font-weight: bold;
    font-size: 13px;
    color: #FFF;
}
.content .form-fields .login .main {
    width: 360px;
    border-top: solid 2px #666;
    background: #CCC url("images/bg-gray-strip-360.gif") repeat-y;
}
.content .form-fields .login .footer {
    width: 360px;
    height: 15px;
    background: #CCC url("images/bg-gray-footer-360.gif") no-repeat;
    background-position: bottom;
}

.content .team-grid-header {
    width: 744px;
    height: 25px;
    margin: 0 auto;
    border-bottom: solid 1px #000;
    background: #122859 url("images/bg-blue-header-744.gif") no-repeat;
    text-align: center;
}
.content .team-grid-header h3 {
    position:relative;
    top: 5px;
    margin: 0;
    font-weight: bold;
    font-size: 13px;
    color: #FFF;
}

.content .team-grid-footer {
    width: 744px;
    height: 15px;
    margin: 0 auto;
    background: #CCC url("images/bg-gray-footer-744.gif") no-repeat;
    background-position: bottom;
    text-align: center;
    color: #666;
}

.content .team-grid { /*border: dashed 1px #F00;*/
    width: 744px;
    display: block;
    margin: 0 auto;
    border-top: solid 2px #666;
    background: #CCC url("images/bg-gray-strip-744.gif") repeat-y;
}
.content .team-grid .team-cell { /*border: dashed 1px #0F0;*/
    
    position:relative;
    float: left;
    display: block;
    margin: 4px;
    width: 114px;
    min-height: 146px;
    /*height: 146px;*/
    height: auto;
    border: solid 1px #000;
    background-color: #FFF;
    background-image: url("images/bg-team-grid-cell.png");
    background-position: 0 0;
}
.content .team-grid .team-cell:hover {
    cursor:pointer;
    background-image: url("images/bg-team-grid-cell.png");
    background-position: 114px 0;
}

.content .team-grid .team-cell .team-logo { /*border: dashed 1px #00F;*/

    position: relative;
    top: 3px;
    margin: 0 auto;
    width: 75px;
    height: 110px;
}

.content .team-grid .team-cell .team-name { /*border: dashed 1px #00F;*/

    position: relative;
    top: 5px;
    margin: 0 auto;
    width: 110px;
    font-size: 10px;
    font-weight: bold;
    text-align: center;
    clear:both;
}


#footer { /*border: dashed 1px #F0F;*/

    position:relative;
    clear: both;
    width: 775px;
    height: 72px;
    margin-bottom: 20px;
    border-left: solid 1px #000;
    border-right: solid 1px #000;
    border-bottom: solid 1px #000;
    background: #CCC url("images/bg-footer.jpg") no-repeat;
    color: #000;
    font-size: 10px;
}

#footer a:link, #footer a:visited {

    color: #933;
    font-weight: bold;
    text-decoration: underline;
}

#footer a:hover {
    
    color: #666;
    font-weight: bold;
    text-decoration: none;
}

#footer a:active {

    color: #00F;
    font-weight: bold;
    text-decoration: underline;
}

#footer .menu {

    position:relative;
    top: 10px;
    clear:both;
    width: 775px;
    height: 25px;
    margin: 0 auto;
    text-align: center;
}

#footer .copyright {

    position: relative;
    top: 8px;
    clear: both;
    width: 775px;
    height: 12px;
    margin: 0 auto;
    text-align: center;
    font-weight: bold;
}

#footer .design-props {

    position: relative;
    top: 10px;
    clear: both;
    width: 775px;
    height: 12px;
    margin: 0 auto;
    text-align: center;
    font-weight: bold;
}

.table 
{
    /*border: solid 1px #000000;*/
    margin:5px;
    width:97%;
    /*background-color:#FFF;*/
    margin-left:auto;
    margin-right:auto;
}

.table th  
{
    background-color: #496CAC;
    color:#FFF;
    padding:2px;
    text-align:center;
}

.table td 
{
    padding-right:5px;
}
.table tr.category 
{
    background-color:#496CAC;
    color:#FFF;
   
}
.table tr.category td 
{
     border: solid 1px #000;
}
.table tr.warning
{
    background-color: #FFC0CB;
    border: solid 1px #CCC;
}

.table td.product 
{
    border: solid 1px #000;
    padding:4px;
    min-height:400px;
    height:auto;
    background-color:#FFF;     
    text-align:center;
}

.table td.product:hover
{
    background-color:#FFD9D9; 
}

.table td .ctitle 
{
    font-size:12px;
    }
.table td .csku 
{
    font-size:11px;
    text-decoration: underline;
    color:Red;
    padding-left:5px;
        }
.table td .cprice 
{
    font-size:12px;
    font-weight:bold;
    text-align:center;
    }
.table td .cimage 
{
    margin-right:auto;
    margin-left:auto;
    width:75px;
}
.table td select.cddl 
{
    font-size:11px;
    width:150px;
    margin-bottom:5px;
    margin-top:5px;
}
.table td .crequired 
{
    color:Red;
    font-weight:bold;
}
.table td .cbreak 
{
    clear:both;    
}
.table td input.ctxt 
{
    font-size:11px;
    width:30px;
}
    
.error 
{
    color:Red;
}

div.border 
{
    border: solid 1px #000;
    width:97%;
    margin-left:auto;
    margin-right:auto;
}