/*
   New Perspectives on HTML and CSS
   Tutorial 5
   Case Problem 2

   CCC Calendar Table style sheet
   Author: David Katelansky
   Date:   06/04/2015

   Filename:         calendar.css
   Supporting Files: bottom.jpg, bottomleft.jpg, bottomright.jpg,
                     left.jpg, right.jpg, top.jpg,
                     tab.jpg, topleft.jpg, topright.jpg, redtab.jpg

*/

table.calendar
{
   width: 650px;
   border: 2px solid rgb(0, 0, 0);  
   border-color: black; 
   border-spacing: 5px;   
   margin-top: 20px;   
   margin-bottom: 5px;
   margin-left: auto;
   margin-right: auto;
   padding: 40px;   
   font-size: 8px;
   background: url('topleft.jpg') top left no-repeat,
			   url('topright.jpg') top right no-repeat,   
               url('bottomleft.jpg') bottom left no-repeat,
               url('bottomright.jpg') bottom right no-repeat,
               url('top.jpg') top left repeat-x,
               url('left.jpg') top left repeat-y,
               url('right.jpg') top right repeat-y,
               url('bottom.jpg') bottom left repeat-x;
}

table.calendar thead
{
   border: 2px solid rgb(0, 0, 0);    
   border-color: black; 
   background-color: red;
   color: white;
   border-spacing: 5px;   
   width: 100%; 
   letter-spacing: 5px;  
}

table.calendar thead th
{
   height: 5%;
}

table.calendar tbody tr td
{
   border: 1px solid rgb(0, 0, 0);    
   border-color: gray; 
   <!-- background-color: white; -->
   border-spacing: 5px;      
   vertical-align: top;  
   height: 19%;   
}

table.calendar tbody tr td h3
{
   font-size: 8px;
}

table.calendar caption
{
   margin-left: auto;
   margin-right: auto;
   padding-bottom: 10px;
   font-size: 16px;
   letter-spacing: 3px;
   width: 100%;
}

table.calendar colgroup col
{
   width: 14%;   
}

table.calendar colgroup col.weekends
{
   background-color: rgb(255, 232, 232);
}

section#summary p
{
   -moz-column-width: 300px;
   -webkit-column-width: 300px;
   column-width: 300px;
   
   -moz-column-gap: 20px;
   -webkit-column-gap: 20px;
   column-gap: 20px;
   
   -moz-column-rule: 1px solid black;
   -webkit-column-rule: 1px solid black;
   column-rule: 1px solid black;
}