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

   CCC Calendar Table style sheet
   Author: Claudia Lindsay
   Date:   10/06/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

*/

/*Style rule for the calendar table - question #8*/
table.calendar {
   border-collapse: separate;
   border-spacing: 5px;
   font-size: 8px;
   margin: 20px auto 5px auto;
   padding: 40px;
   width: 650px;
   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;
}

/*Style rule - question #10*/
table.calendar caption {
padding-bottom: 10px;
font-size: 16px;
letter-spacing: 3px;
width: 650px;
}

/*Style rule - question #11*/
table.calendar col {
   width: 14%;
}

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

/*Style rule - question #12*/
table.calendar thead tr {
   background-color: red;
   color: white;
   letter-spacing: 5px;
}

/*Style rule - question #13*/
table.calendar thead tr {
	height: 5%;
}

table.calendar tbody tr {
   height: 19%;
}

/*Style rule - question #14*/
table.calendar td {
   border: 1px solid gray;
   vertical-align: top;
}

/*Style rule - question #15*/
table.calendar td h3 {
   font-size: 8px;
}

/*Style rule - question #16*/
section#summary div{
   width: 680px; /*300px(x2) each column, plus 20px (x4) each gap = 680*/

   -moz-column-count: 2;
   -webkit-column-count: 2;
   column-count: 2;
   
   -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;
}