﻿
#Sandbox    { background: #00008B; color: #6495ED; padding: .2em; }

body        { font-family: "Lucida Grande", Arial, Sans-Serif; margin: 0 10px; padding: 0; background-color:#fff; color:#403333 }
    /*font-family: Segoe UI, Arial, sans-serif;*/
    /*font-size: large; /* usually 18px */
.header     { border-bottom: 1px solid #ccc; padding: 20px 0px; }
.footer     { border-top: 1px solid #ccc; padding: 10px 0px; }
.logo, .logo:visited  
            { position:relative; font-family: Georgia, Serif; font-size: 36px; font-weight: normal; display:inline-block; text-decoration:none; color:#403333; white-space:nowrap; margin-bottom:.5em; }
.logo img   { width:75px; height:75px; vertical-align:middle; border:none; }
.logo .tagline 
            { display:block; position:absolute; left:75px; bottom:0px; font-size: 21.3px; white-space:nowrap; padding-left:.4em; }
.srmenu     { float:right; clear:right; margin-bottom:.5em; margin-right: .2em; margin-left:.5em }

#MainTitle  { margin:.4em 0em .5em 0em; }
#MainTitle a { color:inherit; text-decoration:none; }

#mainMenu   { margin-top:12px }
#mainMenu > .buttonset  { margin-top:12px; position:relative }
#mainMenu > .buttonset > .label { position: absolute; left: 0; top: -30px; white-space:nowrap }

h1          { font-size: 36px; font-weight:100; }
h2          { font-size: 30px; font-weight:100; }

.sub-header { margin-bottom:1.5em; }
.sub-header .right { float:right; padding: .5em 0em .5em .5em; }
.subsubmenu { margin-bottom:1.5em; }
.subsubmenu .buttonset { display:inline-block; }

.central        { margin-left:auto; margin-right:auto; max-width: 782px; }
.IE6 .central   { width: 782px; }
.main { }
.full-width     { width:100%; text-align:center; clear:both }

.slider { position:relative; }
.slider .port { overflow:hidden; position:relative; width:782px; }
.slider .rack { white-space:nowrap; position:relative; }
.slider .pos-left { position:absolute; top:50%; left:0em; overflow:visible; }
.slider .pos-right { position:absolute; top:50%; right:0em; overflow:visible; }
.slider .control	    { position: absolute; top: 0px; text-align:center; width:100%; }
.slider .control .ui-button-text { padding:0px 10px; display:inline-block }
.slider .control .message { color:#2E6E9E }
.slider .rack > div     { display:inline-block; position: relative; white-space:normal; vertical-align:top; }

#slider .rack > div     { padding: 20px; width: 720px; height:462px; }
#slider .rack > div h1	{ font-family: Helvetica, Sans-Serif; font-size: 30px; color: #ac0000; width:280px }
#slider .rack > div p	{ width: 280px; }
#slider .rack > div img	{ position:absolute; top:0px; right:0px; border:none; outline:none; }

/*.slider .control	    { font-family:Helvetica, Sans-Serif; font-size:20px; }*/

.features { position:relative; padding:20px 20px; min-height:250px; min-width:400px; }
.features > ul { border-bottom:solid 1px #ccc; position:absolute; left:20px; top:20px; width:180px; padding:0px; margin:0px; }
.features > ul > li { border-top:solid 1px #ccc; padding:.5em .5em .5em 0em; list-style:none; cursor:pointer; }
.features > ul > li.act { color:#AC0000; background: url(/css/sel.gif) no-repeat right center;}
.features > ul > li:hover { color:#E17009; }
.features > div { padding-left:220px; text-align:center; }
.features > div h1, .features > div h2, .features > div h3 { margin-top:0px; text-align:left; }
.features > div p { text-align:left; }
.features > div img { max-width:100% }

.sl-links { text-align:center }
.sl-links a { font-size:.9em; padding: 0 3px }
.sl-links .sl-logo { display:block }
.sl-links .sl-logo > img { width:185px }


@media screen and (max-width: 800px) {
    body { margin: 0 5px }
    #mainMenu .buttonset { white-space: normal }
    .admin .logo { display:none }
    .admin .logo, .logo:visited { font-size: 22px; }
    .admin .logo img { width: 50px; height: 50px}
    .admin .logo .tagline { font-size: 13px; left:50px }
    .header { padding:10px 0px; }
    .features { min-width:300px; padding: 5px 0 0 0 }
    .features > ul { width:90px; left:0; top:5px }
    .features > div { padding-left: 100px}
    .ui-button-icon-only .ui-icon, .ui-button-text-icon-primary .ui-icon, .ui-button-text-icon-secondary .ui-icon, .ui-button-text-icons .ui-icon, .ui-button-icons-only .ui-icon {
        margin-top: -9px;
    }
/*    .matrix tr:first-child .teamname { width:2.5em }
    .matrix td { width:2.5em; height:2.5em }
    .matrix td.fixture a { width:2.5em; height:2.5em }*/
    .matrix tr:not(:first-child) .teamname { max-width:5em; overflow-x:hidden; position:relative }
    .matrix tr:not(:first-child) .teamname::after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        width: 10px;
        height: 100%;
        background: rgb(218,218,218);
        background: linear-gradient(90deg, rgba(218,218,218,1) 0%, rgba(250,250,250,0.021446078431372584) 0%, rgba(255,255,255,1) 100%);
    }
}




body.niagara {
    color: #222;
    font-family: Palatino,"Palatino Linotype","Palatino LT STD","Book Antiqua",Times,"Times New Roman",serif;
}
.niagara .header {
    padding: 10px 0;
}
.niagara .logo {
    /*zoom: .52;*/
    float: right;
    font-size: 18.72px;
}
.niagara .logo .tagline {
    font-size: 11.1px;
    left: 39px;
}
.niagara .logo img {
    width: 39px;
    height: 39px;
}
.niagara .logo-niagara {
    float: left
}
.niagara .logo-niagara img {
    margin-right: 20px;
    max-height: 9.2rem;
    max-width: 11rem;
}
.niagara .srmenu {
    margin: 0 0 0 -15px;
}
.niagara .srmenu {
    float:none;
    clear:none;
}
.niagara .srmenu > a.active:first-child {
    margin-left: 15px;
}
.niagara #CompMenu {
    margin: 0 0 0 -15px;
}
.niagara #CompMenu > a.active:first-child {
    margin-left:15px;
}

.niagara .ui-button {
    border: none;
    background-color: #fff;
    background-image: none;
    border-radius: 5px;
    padding: 0;
}
.niagara .ui-button-text-only .ui-button-text {
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif;
    font-size: 1em;
    font-weight: 700;
    letter-spacing: 1px;
    line-height: 1.2;
    padding: 9px 15px;
    text-decoration: none;
    text-transform: uppercase;
    word-wrap: break-word;
    border-radius: 5px;
}
.niagara .ui-buttonset .ui-button {
    margin-right:0;
}
.niagara .ui-state-default, .niagara .ui-widget-content .ui-state-default, .niagara .ui-widget-header .ui-state-default {
    color: #222;
}
.niagara .matrix .alt, .niagara .matrix .teamname .teamtext.alt {
}
.niagara .ui-state-hover {
    background-color: #ca2017 !important;
    background-image:none;
    color: #fff !important;
}
.niagara .active {
    background-color: #ca2017;
    color: #fff;
}
.niagara .link, .niagara .link * {
    color: #ca2017;
    cursor: pointer;
}
.niagara .matrix .alt, .niagara .matrix .teamname .teamtext.alt {
    color: #949599
}
.niagara .faded {
    color: #949599
}

@media screen and (max-width: 800px) {
    .niagara .logo {
        /*zoom: .7;*/
        float: right;
        font-size: 14.98px;
    }
    .niagara .logo .tagline {
        font-size: 8.9px;
        left: 31.2px;
    }
    .niagara .logo img {
        width: 31.2px;
        height: 31.2px;
    }
    .niagara .logo-niagara img {
        margin-right: 15px;
        max-height: 8rem;
        max-width: 9.6rem;
    }
    .niagara table.table.feature td, .niagara table.table.feature th {
        padding:5px 5px 2px 0
    }
}
