
/* BASIC PAGE SETUP ============================================================================= */

body { 
margin : 0 auto;
padding : 0;
font : 100%/1.4 'Open Sans', 'lucida sans unicode', 'lucida grande', 'Trebuchet MS', verdana, arial, helvetica, helve, sans-serif; 	
color : #424242; 
text-align: left;
background-color: #FFCC33;
line-height: 1.4;
}

button, 
input, 
select, 
textarea { font-weight: bold ; 
font-size: 1.1em;
font-family : 'lucida sans unicode', 'lucida grande', 'Trebuchet MS', verdana, arial, helvetica, helve, sans-serif; 
color : #333; }

                div#container {
                     margin: 0 auto;
                     width: 97%;
					 max-width: 600px;
                       }
				#container {
					font-size: 0.9em;
					}

/* RESPONSIVE GRID SYSTEM =============================================================================  */

/*  SECTIONS  */
.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	margin: 1% 0 1% 1.6%;
}
.col:first-child { margin-left: 0; }

/*  GROUPING  */
.group:before,
.group:after {
	content:"";
	display:table;
}
.group:after {
	clear:both;
}

/*  GRID OF TWO   ============================================================================= */


.span_2_of_2 {
	width: 100%;
}

.span_1_of_2 {
	width: 49.2%;
}

/*  GO FULL WIDTH AT LESS THAN 360 PIXELS */

@media only screen and (max-width: 360px) {
	.span_2_of_2 {
		width: 100%; 
	}
	.span_1_of_2 {
		width: 100%; 
	}
}


#header{
float: left;
text-align:center;width: 100%;
	margin: 1px 0px 2px 0px;
	padding: 1px;
        
}
#header h3 { margin: 5px 0px 5px 0px; }
#header h1 { margin: 0px; }

#centered {
  width: 92% ;
  margin-left: auto ;
  margin-right: auto ;
}

.normal            { font-size: 1.05em; 
                     font-family: Calibri, Helvetica, sans-serif ; font-style: normal; font-weight: 100; color: #424242; 
                     text-align: center; margin: 4px; }
.title             { font-weight: bold; 
                     color: #800000;
                     text-align: center; margin: 4px; }
.header            { font-size: 1.3em; font-weight: normal; text-align: center;
                     font-family: Candara, Calibri, Helvetica, sans-serif; color: #800000;
                     text-align: center; margin: 3px; }
.condensed         { font-family: 'Open Sans Condensed', Calibri; font-weight: normal ;
                     font-style: normal ; color: #424242; padding: 2px; border: 0; 
                     text-align: center; margin: 0px; word-spacing: 2px}
.condensed2         { font-family: 'Open Sans Condensed', Calibri; font-weight: bold ;
                     font-style: normal ; color: #424242; padding: 2px; border: 0; 
                     text-align: center; margin: 0px; word-spacing: 2px}
.bold              { font-weight: bold ; color: #424242; padding: 0; border: 0; 
                     text-align: center; margin: 0px; word-spacing: 0}
.italic            {  
                     font-style: italic ; color: #424242; padding: 0; border: 0; 
                     text-align: center; margin: 2px; word-spacing: 0}
.italicnowrap      { white-space: nowrap;
                     font-style: italic ; color: #424242; padding: 0; border: 0; 
                     text-align: center; margin: 1px; word-spacing: 0;}
.nowrap      { white-space: nowrap;
                     padding: 0; border: 0; 
                     text-align: center; margin: 1px; word-spacing: 0;}
.caption           { max-width: 250px; 
                     font-style: italic ; color: #424242; padding: 0; border: 0; 
                     float:right; text-align: center; margin: 1px; word-spacing: 0;}

a:link             { color: #CC0000;
                     font-weight: bold; text-decoration: none; }
a:visited          { color: #800000;
                     font-weight: bold; text-decoration: none; }
a:hover            { color: #800000; background-color: #FF9900;
                     font-weight: bold; text-decoration: none; }
a.alter,a.alter:link,a.alter:visited
                   { background-color: #FFFFCC; } 
a.alter,a.alter:hover,a.alter:active
                   { background-color: #FF9900; } 
a.no-bg,a.no-bg:link,a.no-bg:active,a.no-bg:hover,a.no-bg:active 
                   { background:none; } 
P.small            { font-size: 0.7px; 
                     font-family: Helvetica, sans-serif ;font-style: normal; font-weight: lighter ; color: #424242; 
                     text-align: left; margin: 3px; }
P:first-line       { font-weight: bold; }
h1                 { font-size: 1.7em; margin: 0.5em 0em 0.2em 0em;
                     font-family: 'Open Sans', Calibri, Helvetica, "Century Gothic", sans-serif ; font-weight: bold ; color: #CC0000; }
h2                 { font-size: 1.7em; margin: 0.5em 0em 0.2em 0em;
                     font-family: 'Open Sans', Calibri, Helvetica, "Century Gothic", sans-serif ; font-weight: bold ; color: #CC0000; }
h3                 { font-size: 1.3em; margin: 0.7em 0em 0.4em 0em;
                     font-family: 'Open Sans Condensed', Candara, Calibri, Helvetica, sans-serif ; font-style: normal; font-weight: bold; color: #800000; }
h4                 { font-size: 1.15em; 
                     font-family: Calibri, Helvetica, sans-serif ; font-weight: normal ; color: #424242; }

img                { -ms-interpolation-mode: bicubic;
                     border-width: 0px;
                     float:left;
                     max-width: 100%;
                     height: auto !important;
}
img[alt]           {
                     visibility: visible;
                    }
img.floatleft   { float: left; margin: 0 10px 0 0; }
img.floatright  { float: right; margin: 0 0 0 10px; }
img.bordered    { border-width: 1px;
                     border-style: solid; 
                     border-color: #800000;
                     float:right;
                }
.centered          { border-width: 1px;
                     border-style: solid; 
                     border-color: #800000;
                     margin: 0 auto;
                                  }
hr                 { color:#424242; background-color:#424242; height:1px; border:none; }
ul                 { list-style-type: disc; 
                     list-style-position: inside;
                     margin-left: 0px; padding-left: 0px; }

div.img
  {
  margin:1px;
  border:1px solid #800000;
  height:auto;
  width:auto;
  float:left;
  text-align:center;
  display:block; 
  }

div.kopje4       { border: 1px solid #800000; border-top-width: 0px; border-left-width: 1px ; border-right-width: 0px ; overflow:hidden; height: 15px; background-color: #FFCC33; font-family: Candara, Calibri, Helvetica; font-weight: normal; color: #800000; text-align: left; padding: 3px;}
div.kopje5       { border: 1px solid #800000; border-top-width: 0px; border-left-width: 0px ; border-right-width: 0px ; overflow:hidden; height: 15px; background-color: #FFCC33; font-family: Candara, Calibri, Helvetica; font-weight: normal; color: #800000; text-align: left; padding: 3px;}




