/* -------------- goodiebag.co.za November 2009 -------- */
/* Gryphon Style Sheet                                   */
/* Note that font-size can be either pt or px            */
/*                                                       */
/* The MCM Logo is 690px wide                            */
/*                                                       */
/* ----------------------------------------------------- */

/* -------------- Web Site Colour Scheme ------------------- */
.page_color      {background-color: #d3e2f8;}
.box_bg          {background-color: #d3e2f8} /* 211 226 248  */
.page_divider    {background-color: #1c5e8c;}       
.page_box_border {border:  2px solid #2ea9eb;  
	                padding: 5px 5px; }
.page_box_text      {color: #221177}
.picture_text       {color: #221177}
.page_heading       {color: #228124}
.page_text_heading  {color: #075245}
.page_text          {color: #221177} 
.album_heading      {color: #221177}
.album_text         {color: #221177}
.text_content       {font-size: 10pt; 
                     font-family: verdana, arial, sans-serif}
.text_header        {font-size: 12pt; 
                     font-family: verdana, arial, sans-serif}
.text_sub_header    {font-size: 10pt; 
                     font-family: verdana, arial, sans-serif}

/* -------------- Frames and Boxes---------------- */
#page_frame { width:900px; 
	            border:1px none #ffff0; 
	            background: #ffffff ;      /* #d3e2f8; */
	            border-radius:25px;
	            -moz-border-radius:25px;
	            -webkit-border-radius:25px; }
	            
#start_left_box {width:560px; 
	               border:2px solid #1c5e8c; 
	               background: #ffffff ;      /* #d3e2f8; */
	               padding: 10px 10px;
	               border-radius:25px;
	               -moz-border-radius:25px;
	               -webkit-border-radius:25px; }

#start_right_box {width:280px; 
	               border:1px solid #1c5e8c; 
	               background: #ffffff ;      /* #d3e2f8; */
	               padding: 5px 5px;
	               border-radius:25px;
	               -moz-border-radius:25px;
	               -webkit-border-radius:25px; }

#full_width_box {background: #ffffff ;      /* #d3e2f8; */
	               padding: 10px 10px;
	               border-radius:25px;
	               -moz-border-radius:25px;
	               -webkit-border-radius:25px; }

.box_width_1    {width:828px;}
.box_width_2    {width:420px;}

.box_border_1    {border:1px solid #1c5e8c;}
.box_border_2    {border:2px solid #1c5e8c;}


/* -------------- Web Site Colour Scheme End ---------------- */
a:link    { color: #221177; text-decoration: none }
a:visited { color: #221177; text-decoration: none }
a:hover   { color: #0000ff; text-decoration: underline}
a:active  { color: #0000ff; text-decoration: none }

h1,h2,h3,h4 {font-family: verdana, arial, sans-serif;
             text-align: center}

hr.ruler     {width: 850px;}
hr.ruler_in  {width: 500px;}

hr.page_divider {background-color: #1c5e8c;}       

hr.boxline {color: #ffcc33; /*  old blue = #49a3ff */
	          width: 100%;
	          height:  3px;
	          background-color: #ffcc33;
	          outline-style: none;  
            outline-color: #ffcc33}  
            
hr.center  {position:absolute;
	          left:170px;
            height: 3px}

/* ---------------------------------------------------- */
/* Borders                                              */
/*  STYLE: none, dotted, dashed, solid, double, etc     */
/*  WIDTH: thin, medium, thick, pixels                  */
/* ---------------------------------------------------- */
border_1  {border: thin solid #006699 }

/* This is equivalent to "cellspacing"           */                   
table.borders_col {border-collapse: collapse; } 

table.borders_sep {border-collapse: separate;     * collapse or separate */
                   border-spacing:  10px 10px }   /* only applies if separate */

/* ---------------------------------------------------- */
table.content    {width:  850px;
	                border: 0px none  #1c5e8c } /*thin solid #1c5e8c 0px none */

table.roundcorner {border: 0px none  #49a3ff; /* RGB = 73 163 255 */
                   padding: 0px 0px}

table.table_norm {padding: 10px 10px;
	                border: thin solid #006699;
	                border-collapse: collapse;    /* collapse or separate */
                  border-spacing: 10px 10px }   /* only applies if separate */

table.table_survey {padding: 5px 5px;
	                  border: thin solid #006699;
	                  border-collapse: separate;    /* collapse or separate */
                    border-spacing: 5px 5px }   /* only applies if separate */

table.border_wide {border-collapse: separate;    /*  */
                   border-spacing: 10px 10px }   /* horizontal vertical */


/* ---------------------------------------------------- */
th      {padding: 4px 2px;
         font-weight: bold;
         text-align: center}

td.padpic {padding: 2px 2px; }

td.nopad {border:  0px none #ffffff;   /* 0px none #ffffff 1px solid #ff0000*/
          padding: 0px 0px; }

td.sidepad {border:  0px none #ffffff;   
            padding: 0px 20px 0px 20px; }

td.boxtopbot {border:  0px none #ff0000;   /* 0px none #ffffff 1px solid #ff0000*/
              padding: 0px 0px;
              height:  16px;
              vertical-align: bottom;
              font-size: 2px;
              background-repeat: repeat-x}

td.boxsides {border: 0px none #ff0000;   /* 0px none #ffffff 1px solid #ff0000*/
             padding: 0px 0px;
             width: 16px;
             background-repeat: repeat-y }

td.border {border:  1px solid #1c5e8c;   /* 3px solid #ff0000 */
	         padding: 5px 5px;             /* top, sides        */ }  
            
td.width_5  {width:  5%  }
td.width_8  {width:  8%  }
td.width_16 {width: 16%  }
td.width_24 {width: 24%  }
td.width_10 {width: 10% }
td.width_15 {width: 15% }
td.width_20 {width: 20% }
td.width_25 {width: 25% }
td.width_30 {width: 30% }
td.width_35 {width: 35% }
td.width_40 {width: 40% }
td.width_50 {width: 50% }
td.width_60 {width: 60% }
td.width_80 {width: 80% }
td.width_100 {width: 100% }
	         
td.line   {height: 2px ;  
           vertical-align: top }  

.dotted_bot  {border-width: thin;       /* 0 none #ffffff */
	              border-style: none none dotted none;
	              padding: 2px 2px 2px 2px;} 
.dotted_left {border-width: thin;       /* 0 none #ffffff */
	              border-style: none none none dotted;
	              padding: 2px 2px 2px 2px; } 
.dotted_lebo {border-width: thin;       /* 0 none #ffffff */
	              border-style: none none dotted dotted;
	              padding: 2px 2px 2px 2px; } 
.dotted_leboto {border-width: thin;       /* 0 none #ffffff */
	              border-style: dotted none dotted dotted;
	              padding: 2px 2px 2px 2px; } 
.dotted_bottop  {border-width: thin;       /* 0 none #ffffff */
	               border-style: dotted none dotted none;
	               padding: 2px 2px 2px 2px;} 

/* ---------------------------------------------------- */
.text_8  {font-size:8pt; 
          font-family: verdana, arial, sans-serif}
.text_10 {font-size:10pt; 
          font-family: verdana, arial, sans-serif}
.text_12 {font-size:12pt; 
          font-family: verdana, arial, sans-serif}

.normal  {font-weight: normal}
.bold    {font-weight: bold}
.italic  {font-style: italic}
.center  {text-align: center}
.left    {text-align: left}
.right   {text-align: right} 
.vmiddle {vertical-align: middle} 
.vtop    {vertical-align: top} 

img.middle {vertical-align: middle;}
 
/* ---------------------------------------------------- */
.bg_mustard   {background-color: #ffcc33}
.bg_yellow    {background-color: #ffff00}
.bg_white     {background-color: #ffffff}
.bg_grey      {background-color: #e9e9e9}
.bg_turquoise {background-color: #3f7f8d}
.bg_puce      {background-color: #eaebd8}
.bg_blue_sea  {background-color: #49a3ff}
.bg_blue      {background-color: #1c5e8c}
.bg_blue_back {background-color: #d3e2f8}  /* RGB = 211 226 248  */
/* ---------------------------------------------------- */
.red        {color: #ff0000}
.black      {color: #000000}
.green      {color: #009900} 
.yellow     {color: #ff9900} 
.blue       {color: #1c5e8c} 
.blue_navy  {color: #221177} 
.blue_light {color: #006699} 
.blue_sea   {color: #49a3ff} 
.turquoise  {color: #3f7f8d} 
.charcoal   {color: #666666} 
.grey       {color: #e9e9e9} 
.puce       {color: #eaebd8} 
.mustard    {color: #ffcc33} 

/* ---------------------------------------------------- */
.button     { border-style: outset;
              background-color: #e9e9e9;                        
              border-color:  #006699  #49a3ff  #49a3ff #006699; /* shades of blue   */ 
              border-width: medium}  

.boxborder  { border-style: ridge;
              background-color: #ffffff;                        
              border-color:     #49a3ff #006699 #006699 #49a3ff ; /* shades of blue   */ 
              border-width: thin}  

.wingdings  { font-size:20pt;
              color: #221177}


/* HOVER POPUP LINKS for Calendar */
/* ------------------------------ */

#popup { background-color: #c0c0c0;
	       color: #000000;  }

#popup a span   {display: none;}

/* the IE correction rule */
#popup a:hover {
                color:            #ff0000; 
                background-color: #e9e9e2;
                text-indent: 0; /* added the default value */
               }

#popup a, #popup a:visited 
         {
          display:  block;
          position: relative;
          width:       25px;          
          margin:      0px;
          padding:     0px 0px;      
          border:      1px solid #666666;  /* 1px solid #666 | 0px none #666666  */
          line-height: 20px;
          text-decoration: none;
          text-align:      left;
          font-size:       1em;
          font-weight:     bold; 
         }
                           
#popup a:hover span  /* how the popup looks when you hover over a date */
         {
          display:  block;
          position: absolute;
          top:      0px;
          left:    30px;   /* 50  */
          width:  170px;   /* 200  */
          margin:   0px;
          padding:  5px;
          border: 1px solid #006699; 
          color: #221177;   /* 221177 335500*/
          font-weight: bold;
          background: #49a3ff;  
          text-align: left;
          font-size: 10pt; 
          font-family: verdana, sans-serif;
         }
         
/* END OF HOVER STUFF */

@media handheld { }
@charset "UTF-8";