﻿/*-------------------------------------------------
		    - GLOBAL -						
-------------------------------------------------*/

body {
    font: 12px Arial, "Lucida Grande", "Trebuchet MS", sans-serif;
    color: #555;
    }
    
body, h1, h2, h3, h4, h5, h6, p, ul, li, dl, dt, dd, input, form, fieldset, label {padding: 0;margin: 0}
		
#container { 
	width: 795px; 
	position: relative; 
	margin: 0 auto; 
	text-align: left; 	
	}
    #contain2 {
        width: 778px;
        margin: 0 auto;
    }
	
a { text-decoration: underline; }
a:hover { text-decoration: none; }

p { margin: 0 0 1.5em 0; line-height: 1.5em }
ul, li, dl, dt, dd {list-style: none}

#main_content ul.bullet, #main_content ul.bullet li {
  list-style-image:none;
  list-style-position:outside;
  list-style-type:circle;
  margin-bottom:10px;
  margin-left:10px;
}

.ghost { display : none; }
.center { text-align : center; }

span { font-weight: bold; }


/* ---------------- IMAGES STYLE ---------------*/

img { 
  border: 1px solid #ccc; 
  padding: 5px; 
  margin-bottom: 5px;
}

img.nostyle {
  border:0pt none;
  margin-bottom:0pt;
  padding:0pt;
}

div.images {
  padding: 5px; margin-bottom: 20px;
  text-align: center;
}

div.images img {
  border: 1px solid #ccc; 
  padding: 5px 5px 5px 5px; 
  margin-bottom: 5px;
}

div.images span.caption {
}

div.images span.credit {
  color: #444;
  font-weight: normal;
  font: 10px Arial, "Lucida Grande", "Trebuchet MS", sans-serif;
}
div.images span.credit a {
  color: #444;
  font-weight: normal;
  font: 10px Arial, "Lucida Grande", "Trebuchet MS", sans-serif;
}



p.img { text-align: center; margin-bottom: 2px; }

/*-------------------------------------------------
		    - HEADERS -					
-------------------------------------------------*/

#headers {
    width: 778px;
    margin: 0 auto;
    background: #fff;
    }

#header_01 { 
	clear: both;
        background-repeat: no-repeat;
        background-position: top;
	height: 289px;
        color: #fff;
	}
        
    #header_01 a.toplink {
        position: relative;
        top: 23px; left: 50px;
        height: 33px; width: 350px;
        display: block;
    }
        
        #header_01 p.topmenu {
            text-transform: uppercase;
            font-weight: bold;
            padding: 0px 0 0 520px; margin: -2px 0 0 0;
        }
        #header_01 p.topmenu a {
            color: #fff;
            text-decoration: none;
        }
        #header_01 p.topmenu a:hover {
            text-decoration: underline;
        }
        
    #header_01 h2 {
        text-transform: uppercase;
        font-size: 120%;
        position: relative;
        top: 217px; left: 10px;
    }
    
    #header_01 h2 a { color: #fff; text-decoration: none; }
    #header_01 h2 a:hover { text-decoration: underline; }
	
        
    div#header_01 div#tagline {
      float:right;
      text-transform:uppercase;
      font-weight:bold;
      font-size:120%;
      position:relative;
      top:215px;
      padding-top:3px;
    }

    div#header_01 div.breadcrumbs {
      float:left;
      text-transform:uppercase;
      font-weight:bold;
      font-size:120%;
      position:relative;
      top:215px;
      left:10px;
    }

    div#header_01 div.breadcrumbs a {
      color: white !important;
    }

/*-------------------------------------------------
		    - LEFT -				
-------------------------------------------------*/
    #left {         float: left; 
        clear: left; 
        width: 170px;    }
    #callout {
        text-align:center;
        width: 200px;
    }
  
    #callout p {
        margin-left: auto;
        margin-right: auto;
        width: 160px;
    }
    #callout h4 {
        font-size: 90%;
        font-weight: bold;
    }    
    #side_forms {
        width: 200px;
        height: 155px;
    }
    #side_contact {
        width: 200px;
        height: 385px;
    }

    #side_form {
        width: 170px;
        margin: 0 auto 20px;
        background: #dabfa1;
        font-size: 90%;
        color: #333;
    }
        #side_form h3 {
            color: #fff;
            background: #bfa374;
            padding: 4px 5px;
            font-size: 17px;
        }
        #side_form table {
            padding: 0; margin: 5px;
            border: 0; border-collapse: collapse;
        }
        #side_form table td {
            padding: 2px 3px;
        }

/*-------------------------------------------------
		    - MAIN -				
-------------------------------------------------*/

#main { margin: 0 20px 0 220px; padding: 15px 0 0 0;}

#main_content { margin: 0; padding: 0; }

    #main h2 {
	  font-size: 16px;
	  margin: 0 -20px 8px -10px;
	  font-weight: bold;
          padding: 5px 6px 4px;
          text-transform: uppercase;
          color: #fff;
    }
        #main h2 a, #main h3 a { color: #fff; text-decoration: none; }
        #main h2 a:hover, #main h3 a:hover { text-decoration: underline; }
    
    #main h3 {
        font-size: 16px;
        margin: 0 -20px 8px -10px;
        font-weight: bold;
        padding: 4px 6px 3px;
        text-transform: uppercase;
        color: #fff;
    }
        #main h3 span {
            font-size: 200%;
        }
        
#main ul#landing_list {
    list-style: none;
}
    #main ul#landing_list li {
        display: block;
        margin: 10px 0 10px 0;
        height: 125px;
        border-bottom-style: dashed;
        border-bottom-width: 2px;
    }
    #main ul#landing_list li a {
        display : block;
        padding: 8px 10px 8px 155px;
        text-decoration: none;
        color: #666;
        line-height: 1.4em;
        background-repeat: no-repeat;
        background-position: 6px 6px;
        height: 100px;
    }
        
        #main ul#landing_list li a span {
            font-size: 120%;
            font-weight: bold;
            color: #537819;
        }
        #main ul#landing_list li a em {
            color: #537819;
            font-style: normal;
            text-decoration: underline;
        }

        
    
table#blokke {
    width: 99%;
    margin: 0 0 15px 0;
    border-collapse: collapse;
    border: 0;
}
    
    table#blokke td {
        vertical-align: top;
    }
        
    table#blokke div.block {
        height: 300px;
        width: 220px;
        margin: 10px auto;
    }    
    
    table#blokke h3 {
        color: #fff;
        text-transform: uppercase;
        font-size: 125%;
        padding: 7px 7px; margin: 0;
        font-weight: bold;
        background: none;
    }
    table#blokke p {
        color: #fff;
        padding: 3px 7px 7px;
        margin: 0;
        font-size: 90%;
    }
        table#blokke a {
            color: #fff;
            padding: 0; margin: 0;
        }
    
        table#blokke a img {
            border: 0;
            padding: 0; margin: 0;
            background : none;
        }
        table#blokke a:hover img {
            background: none;
            border: 0;
            padding: 0;
            margin: 0;
        }
        
    .safari { background: #537819; }
    .accommodation { background: #5361a2; }
    .meetus { background: #bb7307; }
    .travelguide { background: #7abbe3; }
    .learningcentre { background: #b7a57d; }
    .funstuff { background: #cf9c24; }
    
    
    table#blokke div.big_block {
        width: 255px;
        margin: 0 20px 0 0;
    }
        table#blokke div.big_block h3 {
            font-size: 12px;
            padding: 6px 8px;
        }
        table#blokke div.block_footer {
            padding: 3px 5px;
            width: 245px;
            font-size: 90%;
            font-weight: bold;
            text-align: right;
        }
        table#blokke div.block_footer a { text-decoration: none; }
        table#blokke div.block_footer a:hover { text-decoration : underline; }


/*-------------------------------------------------
		    - FOOTER -					
-------------------------------------------------*/
#prefooter {
    padding: 10px; 
    clear: both;
    }

#prefooter div { 
    padding: 5px; 
}

#footer {
    clear: both;
    background: #fff;
    margin: 0; padding: 0 0 5px 0;
    }
	
#footer p { 
	text-align: center; 
	margin: 10px 0; padding: 5px 0; 
	font-size : 0.9em;
        line-height: 2em;
	}
        #footer a {
            text-decoration: none;
        }
        #footer a:hover {
            text-decoration: underline;
        }
        
        #footer div.spacer {
            height: 1px;
        }
            
            