﻿html,body
{
   height:100%;
   min-height:600px;
   width:100%;
   min-width:700px;
}
#left
{
    float:left;
}
#right
{
    float:right;
}
#containCalAndDay
{
    width:1150px;
    height:100%;
    min-width:1250px;
}
#calContainer
{
    float:left;
    padding-top:10px;
    height:600px;
}
#daysOfWeek
{
    width:630px;
    height:60px;
    background-color:blue;
    opacity:.3;
    border-top-left-radius:4px 4px;
    border-top-right-radius:4px 4px;
}
.row
{
    -webkit-transition:all .75s ease-in-out;
    -moz-transition:all .75s ease-in-out;
    -ms-transition:all .75s ease-in-out;
    -o-transition:all .75s ease-in-out;
    transition:all .75s ease-in-out;
    background-color:#DFF2F4;
    width:700px;
    height:90px;
    list-style-type:none;
    margin-left:5px;
}
.week
{
    width:630px;
    height:90px;
    list-style-type:none;
    border-radius:3px 3px;
}
.day
{
    -webkit-transition:all .75s ease-in-out;
    -moz-transition:all .75s ease-in-out;
    -ms-transition:all .75s ease-in-out;
    -o-transition:all .75s ease-in-out;
    transition:all .75s ease-in-out;
    width:80px;
    height:80px;
    margin:5px;
    background-color:#66182a;
    border-radius:3px 3px;
    float:left;
    box-shadow:2px 2px 7px black;
    text-shadow:2px 2px 3px black;
}
.day:hover
{
    background-color:#DFF2F4;
}
.lblDay
{
    text-align:center;
    vertical-align:central;
    float:right;
    margin:3px;
    width:15px;
    height:15px;
    color:white;
}
.hDay
{
    width:80px;
    min-width:80px;
    height:10px;
    margin:5px;
    float:left;
    text-shadow:2px 2px 7px black;
    opacity:1.0;
    text-align:center;
}
#headerDays
{
    background-color:lightgray;
    box-shadow:2px 2px 7px black;
    list-style:none;
    width:665px;
    height:30px;
}
#header
{
    opacity:.5;
    list-style:none;
}
#calHeader
{
    width:700px;
    background-color:#DFF2F4;
    padding-top:10px;
    list-style:none;
    height:40px;
    margin-left:4px;
}
#left img, #right img
{
    -webkit-transition:all .75s ease-in-out;
    -moz-transition:all .75s ease-in-out;
    -ms-transition:all .75s ease-in-out;
    -o-transition:all .75s ease-in-out;
    transition:all .75s ease-in-out;
    opacity:.4;
    height:30px;
}
#left img:hover, #right img:hover
{
    background: -webkit-radial-gradient(lightblue, transparent); /* For Safari 5.1 to 6.0 */
    background: -o-radial-gradient(lightblue, transparent); /* For Opera 11.1 to 12.0 */
    background: -moz-radial-gradient(lightblue, transparent); /* For Firefox 3.6 to 15 */
    background: radial-gradient(lightblue, transparent); /* Standard syntax (must be last) */
    opacity:1;
}
#right
{
    margin-right:210px;
}
#left
{
    margin-left:220px;
    margin-right:5px;
}
.hContent
{
    float:left;
}
#month
{
    -webkit-transition:all .75s ease-in-out;
    -moz-transition:all .75s ease-in-out;
    -ms-transition:all .75s ease-in-out;
    -o-transition:all .75s ease-in-out;
    transition:all .75s ease-in-out;
    font-size:30px;
    margin: 0 auto;
    width:200px;
    text-align:center;
    color:gray;
}
#dayView
{
    position:inherit;
    margin-right:50px;
    margin-top:26px;
    float:right;
    background-color:#DFF2F4;
    width:410px;
    height:620px;
}
#dvList
{
    list-style:none;
}
#dvHead
{
    float:left;
    height:70px;
    margin:5px;
    width:320px;
    background-color:#66182a;
    border-top-right-radius:3px 3px;
    border-top-left-radius:3px 3px;
    box-shadow:2px 2px 7px black;
}
.hour
{
    float:left;
    box-shadow:2px 2px 7px black;
    height:30px;
    margin:5px;
    width:320px;
    background-color:white;
    border-top-right-radius:3px 3px;
    border-top-left-radius:3px 3px;
}
.hour:hover
{
    background-color:#DFF2F4;
}
#dvHeadContent
{
    margin-top:20px;
    text-align:center;
    color:white;
    vertical-align:central;
    font-size:20px;
}
.hour div
{
    float:left;
    margin-left:5px;
    color:gray;
}
.hourContent
{
    background-color:gray;
}