html, body {
    margin: 0;
    padding: 0;
    color: #FFFF00; /*background-color:darkblue;*/
    font-family: Arial, 'Microsoft Sans Serif', Tahoma, 'Segoe UI', 'Century Gothic';
    background: url(images/BackgroundBlueToBlack.png) no-repeat fixed center center;
    background-size: cover;
    background-color: #000066;
}

#headerwrapper {
    position: absolute;
    height: 70px;
    width: 100%;
}

.titlebar {
    height: 100%;
    font-size: 3em;
    font-variant: small-caps;
    text-align: center;
    font-weight: bold;
    font-family: Arial;
    border-width: medium;
    border-color: #FFFF00;
    border-bottom-style: solid;
    font-style: italic;
}

#midwrapper {
    position: absolute;
    width: 100%;
    top: 70px;
    bottom: 14px;
}

.leftsidebar {
    min-height: 100%;
    /*height:100%;*/
    float: left;
    width: 195px;
}

.rightsidebar {
    width: 185px;
    float: right;
    min-height: 100%;
    /*height:100%;*/
    padding-right: 12px;
    /*text-align: left;*/
}

.maincontent {
    min-height: 100%;
    /*height:100%;*/
    margin-left: 210px;
    margin-right: 211px;
    padding-left: 12px;
    padding-right: 21px;
    border-right-style: solid;
    border-left-style: solid;
    border-right-width: thin;
    border-left-width: thin;
    border-right-color: #FFFF00;
    border-left-color: #FFFF00;
}

.leftsidebar, .maincontent, .rightsidebar {
    padding-top: 10px;
    padding-left: 12px;
    margin-top: 5px;
    /*http://stackoverflow.com/questions/3960390/how-to-force-an-div-to-extend-down-to-the-bottom-of-the-screen*/
}

.footer {
    border-top: thin solid #FFFF00;
    clear: both;
    height: 14px;
    position: fixed;
    margin: auto;
    bottom: 0;
    text-align: center;
    font-size: x-small;
    font-weight: bold;
    width: 100%;
    color: #FFFF00;
    background-color: #000075;
    left: 16px;
}

.announcements{
    margin-bottom:21px;
    border:solid;
    border-width:1px;
    border-color:#FFFF00;
    border-radius:7px;
    padding:21px;
}

.teams {
    /*column-count: 3;
    column-gap: 1em;
    column-rule: 1px solid white;*/
    /*width: 100%;
    margin-right: auto;
    overflow: hidden;*/
}

.team1, .team2, .team3, .team4 {
    width: 33%;
}

.team1 {
    float: left;
}

.team2 {
    float: left;
}

.team3 {
    float: left;
    width: 34%;
}

.team4 {
    float: left;
}

div.schedule {
    text-align: center;
    font-size: medium;
    line-height: 17px;
}

li {
    margin-bottom: 10px;
}

IMG.Centered {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.emphasis {
    font-size: medium;
    font-weight: bold;
    color: #FFFFFF;
}

/*span.error
{
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #FF00FF;
}*/

.leftcolumn {
    width: 200px;
    float: left;
    margin-right: 33px;
}

/*.pagecounter
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: x-small;
    color: #00FF00;
    text-align: right;
}*/

/*p.quote
{
    font-size: .77em;
    color: #FFFFFF;
}*/

.MarginLeft17 {
    margin-left: 17px;
}

.TextCenter {
    text-align: center;
}


.TextSmall {
    font-size: small;
}

.TextVerySmall {
    font-size: x-small;
}

.TextBold {
    font-weight: bold;
}

ul {
    display: inline-block;
    *display: inline;
    zoom: 1;
}
/*.ulColumn {
    width: 20%;
    float: left;
}*/

.UnderlineOff {
    text-decoration: none;
}

.VideoContainer {
    margin-top: 7px;
}

.VideoContents {
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
    font-size: xx-small;
    color: #FFFFFF;
    padding-left: 7px;
}

.VideoTitle {
    padding-left: 3px;
    padding-right: 3px;
}

.WelcomeBack {
    text-align: center;
    font-size: 70px;
    font-family: Gabriola;
    color: gold;
    padding: 40px;
}

.SpecialFontForHolidays {
    text-align: center;
    font-family: Gabriola;
    font-size: 49px;
    font-weight: bold;
    color: gold;
    font-style: italic;
    font-variant: normal;
}

a {
    position: relative;
    color: white;
    text-decoration: none;
}

    a:hover {
        color: white;
    }


    a:before {
        content: "";
        position: absolute;
        width: 100%;
        height: 2px;
        bottom: 0;
        left: 0;
        background-color: white;
        visibility: hidden;
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transition: all 0.3s ease-in-out 0s;
        transition: all 0.3s ease-in-out 0s;
    }


    a:hover:before {
        visibility: visible;
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
    }