/*** CholoroGIN-Africa styles ***/

/** Body **/
body {
   padding: 0em;
   margin-top: 0;
   padding-left: auto;
   padding-right: auto;

   font-family: arial, veranda, sans serif;
   background-color: #041943;
}

/** Dividers **/
div.floatLeft {
   height: 1.1em;
   clear: both;
   margin: 2px 5px 0 0;
   float: left;
}

div.floatLeft {
   float: left;
}

div.banner_img {
   position:absolute;
   right:17%
}


div.content {
   width: 837px;
   margin: 0em;
   margin-left: auto;
   margin-right: auto;
   
   padding: 0em;
}

div.textBox {
   margin: 0em;
   margin-top: 1em;
   margin-bottom: 1em;
   padding: 0em;
}

div.seperator {
   height: 10px;
   clear: left;
}

div.addressBox {
   float: left;
   width: 33%;
}

/** Headings **/
h1 {
   margin: 0em;
   padding: 0em;

   font-family: arial, veranda, sans serif;
   color: #FFFFFF;
}

h2 {
   margin: 0em;
   margin-bottom: 0.5em;
   padding: 0em;
   
   color: #FFFFFF;
   font-family: arial, veranda, sans serif;
}

h3 {
   margin: 0em;
   margin-bottom: 0.25em;
   margin-top: 0.25em;
   padding: 0em;
   
   color: #FFFFFF;
   font-family: arial, veranda, sans serif;
}

h3.nomargin{
   margin: 0 auto 0 auto;
}

h4 {
   margin: 0em;
   padding: 0em;
   margin-bottom: 0.5em;

   color: #D5D5D5;
   font-family: arial, veranda, sans serif;
   font-size: 10pt;
}

h4.black {
   color: #000000;
}

/** Fonts **/
p {
   margin: 0em;
   padding: 0em;

   color: #FFFFFF;
   font-family: arial, veranda, sans serif;
   font-size: 10pt;
}

p.black {
   color: #000000;
}

p.center {
   text-align: center;
}

p.justify {
   text-align: justify;
}

p.big {
   font-size: 12pt;
}

p.small {
   font-size: 8pt;
   text-align: right;
   color: #FFFFFF;
}

/** Tables **/
table, tr, th, td {
   margin: 0em;
   padding: 0em;

   font-family: arial, veranda, sans serif;
   font-size: 10pt;
   text-align: left;
}

th, td {
   padding-left: 5px;
   padding-top: 5px;
}

tr.nopad, td.nopad{
   padding-top: 0px;
   padding-bottom: 0px;
   line-height: 1.5em;
}

/** Links **/
a {
   padding: 0em;
   margin: 0em;

   color: #FFFFFF;
   font-family: arial, veranda, sans serif;
}

a:link {}
a:visited {}
a:hover {color: #B7B4A8;}
a:active {}

a.menu {
   padding: 0em;
   margin: 0em;
   margin-right: 1em;
   
   color: #FFFFFF;
   text-decoration: none;
   font-family: arial, veranda, sans serif;
   font-size: 10pt;
}

a.menu:link {}
a.menu:visited {}
a.menu:hover {color: #B7B4A8;}
a.menu:active {}

/** Forms **/
input.button {
   background-color: #688EC3;
   margin: 0 auto 0 auto;
   border: 2px #BFBFBF solid;
   float:left;
}

/** Images **/
img {
   border: 0;
}

img.logo {
   padding: 0.25em;
}

/** Unique id styles **/
#map {
   clear: both;
   width: 498px;
   border: 1px grey solid;
}

#worldmap {
   width: 720px;
   height: 360px;
   border: 1px grey solid;
   margin-bottom: 0;
   padding: 0;
}


#europemap {
   width: 756px;
   height: 456px;
   border: 1px grey solid;
   margin-bottom: 0;
   padding: 0;
}


#dateSelection {
   float: right;
   width: 109px;
   margin-left: 5px;
   color: #fff;
}

#dateSelection2 {
   color: #fff;
   width: 600px;
   padding: 3px 56px 0 56px;
   height: 30px;
   margin: 8px auto 10px auto;
   border: 4px solid #BFBFBF;
   background-color: #2d5793;
}

#areasSelected {
   color: #fff;
   width: 305px;
   height: 460px;
   margin-left: 0.5em;
   padding: 5px;
   clear: both;
   /* background-color: #E6E6E6; */
   background-color: #2d5793;
   border: 4px #BFBFBF solid;
}

.worldareasSelectedLeft {
   color: #fff;
   width: 340px;
   height: 12.5em;
   float: left;
   /* background-color: #E6E6E6; */
   background-color: #2d5793;
   border: 4px #BFBFBF solid;
}

.worldareasSelectedRight {
   color: #fff;
   width: 340px;
   height: 12.5em;
   float: right;
   /* background-color: #E6E6E6; */
   background-color: #2d5793;
   border: 4px #BFBFBF solid;
}

.europedateSelected {
   color: #fff;
   width: 340px;
   height: 17.5em;
   float: left;
   /* background-color: #E6E6E6; */
   background-color: #2d5793;
   border: 4px #BFBFBF solid;
}

.europeareasSelected {
   color: #fff;
   width: 340px;
   height: 17.5em;
   float: right;
   /* background-color: #E6E6E6; */
   background-color: #2d5793;
   border: 4px #BFBFBF solid;
}

#banner {
   width: 100%;   
}


#menuLinks {
   height: 35px;
   margin: 0em;
   margin-top: 1em;
   margin-bottom: 1em;
   padding: 0em;
   border-bottom: 1px solid gray;
}

#resetMapDiv {
   width: 100%;
   text-align: right;
}

#worldresetMapDiv {
   float: right;
}

#logos {
   width: 100%;
   clear: left;
   margin-left: auto;
   margin-right: auto;

   vertical-align: middle;
   border: 2px solid gray;
   background-color: #FFFFFF;
   text-align: center;
}

/* These three classes (areasTop, areasBottom and
   dateSelectionInfo) are to align the date info at
   the foot of the areas selected panel. See:
   http://www.badboy.ro/articles/2005-02-20/vertical_align_with_css/
   for how. */

#areasTop {
   height: 50%;
}

#areasBottom {
   z-index:0;
   height: 50%;
   position: relative;
}

#dateSelectionInfo {
   clear: both;
   margin: 10px auto 0 auto;
}

#dateSelectionLabel {
   margin: 0.5em 0 0.5em 0;
   font-size: 10pt;
}

.dateForm {
   float:right; 
   margin: 2px 5px 0 0;
   height: 1.1em;
   border: 0;
   text-align: center;
}

.dateForm2 {
   float:left; 
   border: 0;
   text-align: center;
   margin: 2px 5px 0 0;
}

p.dateForm {
   float: left;
   margin-bottom:10px;
   font-weight: bold;
   text-decoration: underline;
   font-size: 12pt;
}

.center{
   margin: 0 auto 0 auto;
}

.areaContainer{
   width: 720px;
   height: 13em;
   margin: 0 auto 0 auto;
}

.homeul{
   color: #fff; 
   font-size: 10pt;
   
}