@charset "utf-8";
/* ~~~~~~~~~~~~ font sizes */
h1 {font-size:1.125em; margin-bottom:48px; color:#025770; margin-left:55px; font-weight:normal;}
h2 {font-size:0.875em; margin-bottom:20px; margin-top:35px; color:#025770; margin-left:55px; font-weight:normal;}
.me #mainnav ul li {font-size:0.688em}
.me #header ul li {font-size:0.625em}
.me .text {font-size:0.75em}
.hid_img {position:absolute; top:540px; right:150px; z-index:-10;}

/* ~~~~~~~~~~~~ navigation */
#navcontainer {
position:relative;
top:0;
right:0;
float:right;
height:1.563em;
font-size:0.625em;
width:6.25em;
min-width:100px;
min-height:25px;
background-color:#E1EFF2;
}

#navcontainer ul
{
padding: 0;
margin: 0;
position:absolute;
top:0;
left:0;
background-color:#5488D4;
background-color:#80BFCF;
color: White;
float:right;
width: 100%;
font-family: arial, helvetica, sans-serif;
text-align:center;
}

#navcontainer ul li { display: inline; 
position:absolute;
top:0;
right:0;
}

#navcontainer ul li a
{
position:relative;
top:0;
left:0;
padding: 0.6em 2.77em;
background-color:#89C1CE;
background-color:#80BFCF;
color: White;
text-decoration: none;
float: right;
}

#navcontainer ul li a:hover
{
background-color: #256073;
color: #fff;
}



#mainnav {
margin:45px 0 75px 0;
}

.me #mainnav ul{
margin-left: 0px;
padding-left: 0px;
list-style-type: none;
padding-top:0;
padding-bottom:0;
}

.me #mainnav ul li{
padding-top:3px;
padding-bottom:0;
}

.me #mainnav ul li a {
text-decoration: none;
/*color: #32778C;*/
color:#025770;
font-weight:500;
margin-left:0;
display: block;
width: 15.5em;
padding-left: 55px;
padding-right:3px;
padding-top:0;
padding-bottom:0;
}

.me #mainnav ul li a:hover {
	/*color:#32778C;*/
	color:#025770;
	background-color:#EBF0C7;
	/*background-color:#f2ebce;*/
}


#mainnav_active a{
background-color:#EBF0C7;
/*background-color:#f2ebce;*/
}

.me #footer a {
color:#003366;
text-decoration:none;
}

.list {
font-size:0.75em;
margin-left:0;
padding-left:0;
}

.list li {
margin-left:70px;
list-style-type:disc;
}

img {border:none;}

/* ~~~~~~~~~~~~ links */



/* ~~~~~~~~~~~~ general */

body  {
font: 100% Arial, Helvetica, sans-serif;
background-color: #E1EFF2;
margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
padding: 0;
text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
color: #444444;
}

.me #container {
position:relative;
top:-1px; /* To hide the border which fixes the top gap in FF */
left:0; /* position relative here resets the 0,0 reference for abolute positioning of child elements */
width: 748px;  
height: 100%;
margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
text-align: left; /* this overrides the text-align: center on the body element. */
border-top:1px solid; /* this fixes a gap at the top in FF */
} 

.me #wrapper {
position:relative;
top:2.188em;
left:0;
width: 748px; /* To retain a white background acrros the width of the page */
margin-bottom:5.75em; /* Space from Footer */
background-color: #fff;
padding-bottom:100px; /* Space after the end of the content */
}

/* ~~~~~~~~~~~~ specific */

.me #wrapperend {
margin-left:55px;
margin-bottom:0;
position:absolute;
bottom:0;
clear:both;
width:638px;
height:25px;
background-image:url(images/skopelosfooter.gif);
background-repeat:repeat-x;
}

/*.me #header {
position:absolute;
top:0;
right:0;
text-align:center;
background-color:#99CCFF;
height:1.563em;
width:6.25em;
min-width:100px;
min-height:25px;
padding:0;
margin:0;
} */

/*.me #header ul{
list-style:none;
margin:auto;
padding:0;
}

.me #header ul li{
width:100px;
height:25px;
margin: auto;
}
*/


.me .leftContent {
float: left; /* since this element is floated, a width must be given */
width: 410px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
padding: 0;
margin-left:0px;
}

.me #logo{
margin-top:60px;
margin-left:55px;
}
.me .leftContent .text{
margin-left:55px;
}

.me .rightImage { 
	margin: 0 0 0 292px; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	padding: 0 0 0 0; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	background-color:#fff;
} 


.me .mainContent { 
	margin: 0 0 0 292px; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	padding: 0 0 0 0; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	background-color:#fff;
} 

.me #picture { 
	padding: 0 0px 0 0; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	background:#eeeeee; 
} 

.me #footer { 
	margin-top:0;
	margin-right:75px;
	margin-bottom:1.75em;
	padding: 0; 
	border-top: 2px solid #E7EBF1;
	text-align:right;
	font-size:0.688em;
	color:#6A9DA1;
	line-height:140%;
} 

.me #footer a {
color:#333;
text-decoration:none;
}

.me #footer a:hover {
color:#333;
text-decoration:underline;
}

.me #footer p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}

.linksfooter {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: normal;
color: #3d91ab;
text-decoration: none;
margin-left: 0px;
margin-top: 0px;
margin-bottom:  0px;
padding: 0px;
}

.linksfooter:hover {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: normal;
color: #000000;
text-decoration: underline overline;
margin-left: 0px;
margin-top: 0px;
margin-bottom:  0px;
padding: 0px;
}