/* Css originally by mejobloggs  Design by Aran @ studio7designs.com  You can join my linkshare to help you with your google ranking */

body {
	font-family: trebuchet ms, verdana, arial, tahoma;
	font-size: 85%;
	color:#2554C7;;
	background-color: white;
	line-height: 180%;
	margin: 0;
	padding: 0;
	text-align: center;
       overflow: auto
}

/* Set the page width here */
#menu-top, #header, #wrapper-content, #wrapper-footer {
	width: 85%;
	margin: 0 auto;
	text-align: left;
}

#menu-top {
	background: white url('bg02-white-right.png') no-repeat right top;
	overflow: hidden;
}

#menu-top ul {
	background: transparent url('bg02-white-left.png') no-repeat left top;
	margin:0;
	padding: 4em 0 0 0;
	list-style: none;
	font-size: 85%;
	float: left;
	padding-left: 20px;
}

#menu-top li {
	display: inline;
	float: left;
}


#menu-top a {
	float: left;
	background:url(menuleft.png) no-repeat left top;
	margin:0;
	padding:0 0 0 4px;
	text-decoration:none;
	line-height: 1.5em;
}

/* dictates the color  and size of the letters in the tabs */ 
#menu-top a span {
	background: transparent url(menuright.png) no-repeat right top;
	padding:5px 15px 4px 6px;
        color:#2554C7; 
        font-size: 150%;
	display: block;
	float: left;
	cursor: pointer; /* IE doesnt display the hand when you roll over the link for some reason. This fixes it */
}

#menu-top a:hover { background-position:0% -42px; }
#menu-top a:hover span {	background-position:100% -42px; }
a:link, a:visited, a:active {text-decoration: none}

#wrapper-header {	background: transparent url('bg.png') top center repeat-x; }

#header { background: #eee url('HBA_logo4.png') no-repeat center top;}

#wrapper-header2 { background: transparent url('bg02-blue-left.png') top left no-repeat; }

#wrapper-header3 { background: transparent url('bg02-blue-right.png') top right no-repeat; }

/* color and font of the header like the Hellenic Bioscientific blah blah */
#header h1 {
	margin: 0 30px;
	padding: 0;
	height: 190px;
	line-height: 2em;
        color:#000000;
	font-size: 220%;
}

#wrapper-content { background: white url('bg02-white-left.png') no-repeat left top; }

* html #wrapper-content { height: 1%; }

#content {
	background: transparent url('bg02-white-right.png') no-repeat right top;
	padding: 5px 245px 5px 40px;
}

#wrapper-menu-page {
	float: right;
	width:180px;
	margin: 20px 30px 3em 2em;
	background: transparent url('menu.png') no-repeat;
	text-align: center;
	line-height: 170%;
	font-family:"Lucida Grande","Lucida Sans Unicode",arial,sans-serif;
}

* html #wrapper-menu-page { margin-right: 15px; }

#menu-page { padding-top: 5px; }

#menu-page ul {
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 130%;
}

/* The LINKS on the side */
#menu-page h3 {
	font-size: 165%;
	text-transform: uppercase;
	margin: 1em 0 0.3em 0;
	color:#2554C7;
	font-weight: 800; <!-- 400 is normal -->
	letter-spacing: 0.25em;
}


/* Properties for the LINKS tab on the side */ 
#menu-page a:link, #menu-page a:visited { color:#000000; }
#menu-page a:hover { color: #5b8fbe; }

#wrapper-footer {
	margin-top: 1em;
	text-align: center;
       color:#2554C7;
}

#footer {
	margin: 0 20px;
	background-color: #e5f0fc;
	border: 1px solid #ccc;
	border-bottom: 0;
	clear: both;
}

ul.NoBullet {
  list-style-type: none}

ul.NoBulletNoIndent {
  list-style-type: none;
  margin-left: 0px;
  padding-left: 0px
}


.roundedcornr_box_552417 {
   background: #357cc1;
width:100%
}
.roundedcornr_top_552417 div {
   background: url(roundedcornr_552417_tl.png) no-repeat top left;
}
.roundedcornr_top_552417 {
   background: url(roundedcornr_552417_tr.png) no-repeat top right;
}
.roundedcornr_bottom_552417 div {
   background: url(roundedcornr_552417_bl.png) no-repeat bottom left;
}
.roundedcornr_bottom_552417 {
   background: url(roundedcornr_552417_br.png) no-repeat bottom right;
}

.roundedcornr_top_552417 div, .roundedcornr_top_552417, 
.roundedcornr_bottom_552417 div, .roundedcornr_bottom_552417 {
   width: 100%;
   height: 30px;
   font-size: 1px;
}
.roundedcornr_content_552417 { margin: 0 20px; }



.roundedcornr_box_550485 {
	background: url(roundedcornr_550485_tl.png) no-repeat top left;
        width: 100%
}
.roundedcornr_top_550485  {
	background: url(roundedcornr_550485_tr.png) no-repeat top right;
}
.roundedcornr_bottom_550485 {
	background: url(roundedcornr_550485_bl.png) no-repeat bottom left;
}
.roundedcornr_bottom_550485 div {
	background: url(roundedcornr_550485_br.png) no-repeat bottom right;
}
.roundedcornr_content_550485 {
	background: url(roundedcornr_550485_r.png) top right repeat-y;
}

.roundedcornr_top_550485 div,.roundedcornr_top_550485,
.roundedcornr_bottom_550485 div, .roundedcornr_bottom_550485 {
	width: 100%;
	height: 30px;
	font-size: 1px;
}
.roundedcornr_content_550485, .roundedcornr_bottom_550485 {
	margin-top: -15px;
}
.roundedcornr_content_550485 { padding: 0 20px; }




* {
margin: 0;
}
html, body {
height: 100%;
overflow: auto
}
.wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -8em;
}
.footer, .push {
clear:both;
height: 4em;
}

H4 { text-align: left}

.menu ul li {
line-height : 1.8em;
margin : 0 10px 0 0;
padding : 0;
list-style-type : square;
color : #476042;
background: inherit;
}
.menu ul li a {
color : #f17c0b;
background : inherit;
}
.menu ul li a:hover {
color : #7ABA2E;
background : inherit;
}


/** FORM */ 

fieldset {   
margin: 1.5em 0 0 0;   
padding: 0;  
background-color: #D8D8D8;
}  
legend {   
margin-left: 1em;   
color: #000000;   
font-weight: bold;  
}  
fieldset ol {   
padding: 1em 1em 0 1em;   
list-style: none;  
}  
fieldset li {   
padding-bottom: 1em;  
}  
fieldset.submit {   
border-style: none;  
}

label {    
float: left;    
width: 10em;    
margin-right: 1em;    
text-align: right;   
}



p, ol, ul {
	margin-top: 0px;
}

p {
	line-height: 170%;
}

ul {
	margin: 0px;
	padding: 0px;
	list-style: none;
}


/** IMAGE PALETTE */


div.img
  {
  margin:2px;
  margin-bottom: 60px; 
  border:2px solid #000000;
  height:auto;
  width:auto;
  float:left;
  text-align:center;
  }
div.img img
  {
  display:inline;
  margin:3px;
  border:1px solid #ffffff;
  }
div.img a:hover img
  {
  border:1px solid #000000;
  }
div.desc
  {
  text-align:center;
  font-weight:normal;
  font-color #000000
  width:200px;
  margin:2px;
  }

#container {
    width: 500px;
    position: relative
}