﻿
#page {
    position:relative;
    width:900px;
    margin:0 auto;
    font-size:12pt;
    /*background-color:rgba(224, 224, 224, 0.85);*/
}

#header{
    position:relative;
    width:900px;
    height:108px;
    background-image: url(/Images/vtm_head_wide.jpg);
    background-repeat:no-repeat;
    background-size:100% 100%;
}

#logo{
    position:absolute;
    top:14px;
    left:14px;
}

#logo img{
    max-width:100%;
}

.marquee {
            width: 200px;
            height: 275px;
            -moz-border-radius:5%;
           -webkit-border-radius:5%;
            border-radius:5%;
            margin: 0 auto;
            filter: progid:DXImageTransform.Microsoft.Gradient(defaultColorStr='#103567', endColorStr='#436499', gradientType='1');
            background-color:#4367a5;
            color:#ffffff;
            text-align:center;
            white-space: normal;
            overflow: hidden;
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
        }

            .marquee span {
                display: inline-block;
                -moz-animation: marquee 15s linear infinite;
                -webkit-animation: marquee 15s linear infinite;
                -o-animation: marquee 15s linear infinite;
                animation: marquee 15s linear infinite;
            }

                .marquee span:hover {
                    -moz-animation-play-state: paused;
                    -webkit-animation-play-state: paused;
                    -o-animation-play-state: paused;
                    animation-play-state: paused;
                }

        /* Make it move */    
        @-moz-keyframes marquee {
            0% {
                -moz-transform: translate(0, 275px);
                -webkit-transform: translate(0, 275px);
                -o-transform: translate(0, 275px);
                -ms-transform: translate(0, 275px);
                transform: translate(0, 275px);
            }

            100% {
                -moz-transform: translate( 0,-275px);
                -webkit-transform: translate( 0,-275px);
                -o-transform: translate( 0,-275px);
                -ms-transform: translate( 0,-275px);
                transform: translate( 0,-275px);
            }
        }
        @-webkit-keyframes marquee {
            0% {
                -moz-transform: translate(0, 275px);
                -webkit-transform: translate(0, 275px);
                -o-transform: translate(0, 275px);
                -ms-transform: translate(0, 275px);
                transform: translate(0, 275px);
            }

            100% {
                -moz-transform: translate( 0,-275px);
                -webkit-transform: translate( 0,-275px);
                -o-transform: translate( 0,-275px);
                -ms-transform: translate( 0,-275px);
                transform: translate( 0,-275px);
            }
        }   
        @-ms-keyframes marquee {
            0% {
                -moz-transform: translate(0, 275px);
                -webkit-transform: translate(0, 275px);
                -o-transform: translate(0, 275px);
                -ms-transform: translate(0, 275px);
                transform: translate(0, 275px);
            }

            100% {
                -moz-transform: translate( 0,-275px);
                -webkit-transform: translate( 0,-275px);
                -o-transform: translate( 0,-275px);
                -ms-transform: translate( 0,-275px);
                transform: translate( 0,-275px);
            }
        }
        @keyframes marquee {
            0% {
                -moz-transform: translate(0, 275px);
                -webkit-transform: translate(0, 275px);
                -o-transform: translate(0, 275px);
                -ms-transform: translate(0, 275px);
                transform: translate(0, 275px);
            }

            100% {
                -moz-transform: translate( 0,-275px);
                -webkit-transform: translate( 0,-275px);
                -o-transform: translate( 0,-275px);
                -ms-transform: translate( 0,-275px);
                transform: translate( 0,-275px);
            }
        }

/* Week.aspx*/
.clocktimeHead
		    {
		        font-size:12px;
		        font-weight:bold;
		    }
		    .clocktime
		    {
		        font-size:12px;
		    }
		    
		    #tbClock
		    {
		        width:380px; 
		        text-align:center;
		    }
		    #tbClock td
		    {
		         border: solid 1pt #CCCCCC;
		    }
		    
		    .lunchtime
		    {
		        font-size:12px;		       
		    }
		    
		    .lunchtimeHead
		    {
		        font-size:12px;
		        font-weight: bold;
		        background-color:#DADADA;
		        width: 100%;	             		       
		    }

            .tracktime{
                background-color: #104d8e;
                color: #ffffff;
                font-weight:600;
                width:96%;
            }

		    .relative {
                position:relative;
                top:0;
                right:0;
                width:32px;
		    }

		    .rerelative a {
		        text-decoration: none;
		    }

		    #sunNotes {
                position:absolute;
                top:-10px;
                left:0;                
                width:224px;
                height:160px;
                background-color:lightyellow;                
                -moz-border-radius: 4px;
                -webkit-border-radius: 4px;
                border-radius: 4px;
                border: 1px solid #000000;
                display:none;
                z-index:999999;
		    }
            #monNotes {
                position:absolute;
                top:-10px;
                left:-32px;
                width:224px;
                height:160px;
                background-color:lightyellow;                
                -moz-border-radius: 4px;
                -webkit-border-radius: 4px;
                border-radius: 4px;
                display:none;
                z-index:999999;
		    }
            #tueNotes {
                position:absolute;
                top:-10px;
                left:-64px;
                width:224px;
                height:160px;
                background-color:lightyellow;                
                -moz-border-radius: 4px;
                -webkit-border-radius: 4px;
                border-radius: 4px;
                display:none;
                z-index:999999;
		    }
            #wedNotes {
                position:absolute;
                top:-10px;
                left:-96px;
                width:224px;
                height:160px;
                background-color:lightyellow;                
                -moz-border-radius: 4px;
                -webkit-border-radius: 4px;
                border-radius: 4px;
                display:none;
                z-index:999999;
		    }
            #thuNotes {
                position:absolute;
                top:-10px;
                left:-128px;
                width:224px;
                height:160px;
                background-color:lightyellow;                
                -moz-border-radius: 4px;
                -webkit-border-radius: 4px;
                border-radius: 4px;
                display:none;
                z-index:999999;
		    }
            #friNotes {
                position:absolute;
               top:-10px;
                left:-160px;
                width:224px;
                height:160px;
                background-color:lightyellow;                
                -moz-border-radius: 4px;
                -webkit-border-radius: 4px;
                border-radius: 4px;
                display:none;
                z-index:999999;
		    }
            #satNotes {
                position:absolute;
                top:-10px;
                left:-192px;
                width:224px;
                height:160px;
                background-color:lightyellow;                   
                -moz-border-radius: 4px;
                -webkit-border-radius: 4px;
                border-radius: 4px;             
                display:none;
                z-index:999999;
		    }

		    .textBox {
		        font-family: Arial, sans-serif;
		        font-size: 10pt;
		    }

		    .auto-style1 {
                filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr='#C0C0C0', endColorStr='#E0E0E0', gradientType='0');
                background-color: #e0e0e0;
                width: 40px;
            }
            .auto-style2 {
                background-color: #F5F5F5;
                width: 40px;
            }