﻿/* Marios Polyzoes (Apr 04, 2012) Μάριος Πολυζώης 
 Rev (Jan 05, 2016) */
html { overflow-y: scroll;}

@-viewport {
    width: device-width;
}
body {
background-image: linear-gradient(top, rgb(34,110,34) 37%, rgb(62,143,62) 80%);
background-image: -o-linear-gradient(top, rgb(34,110,34) 37%, rgb(62,143,62) 80%);
background-image: -moz-linear-gradient(top, rgb(34,110,34) 37%, rgb(62,143,62) 80%);
background-image: -webkit-linear-gradient(top, rgb(34,110,34) 37%, rgb(62,143,62) 80%);
background-image: -ms-linear-gradient(top, rgb(34,110,34) 37%, rgb(62,143,62) 80%);

background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0.37, rgb(34,110,34)),
	color-stop(0.8, rgb(62,143,62))
);
/*background:transparent url("images/667143.jpg") top left repeat-x fixed;*/
background-color: #667143;
margin: 0;
padding:0;
color:#464455;
}
.container {
color:#000;
margin:0 auto;
margin-top:10px;
padding:0px 0px;
background-color:#fff;
}

.pic {
	margin: 5px 10px;
	float: right;
}
.h_flag { width:150px; float:right; margin-top:3px;
}
.h_flag img { border:1px solid #969696; box-shadow: 2px 2px 4px #777;
}

#main {
/*clear:both;*/
margin-top:0px;
}

#content li{
LIST-STYLE-IMAGE:url("images/ob.gif");
}
A:LINK { text-decoration: none;
	color: #00a; }
A:active {
	COLOR: #d00; TEXT-DECORATION: none}
	
A:VISITED {text-decoration: none;
	color: #a0a; }
A:hover {
	COLOR: #AA6000; TEXT-DECORATION: underline;
}
.clear {
	clear:both;
}
.titlos {font-weight: bold; color: #ffee00;}
h1 {color: #900;}
	
h2 {text-align: left;
	color: navy;
	margin-bottom:0px;
		 }
th { background: orange; color: white}
h3 {	text-align: left;
	font-weight: bold;
	color: #068;
	margin-bottom:-4px; }
h4 {	text-align: right;
	color: #a20;
font-weight: bold;
	margin-top:-20px; }
h5 {  font-weight: normal;
font-weight: bold;
}

h6 {text-align: center;
	color: #2F4F4F;
	margin-top: -6px;
	font-weight: normal;
 }
.kap {
	margin-left:16px;
}
/* ---------------*/

.nav
{
margin-top: 0px;
padding: 0px 0px 0px 0px;
}

.nav ul
{
margin:0px 0px 0 0;
/*margin-top: 8px;*/
padding: 0px 0px 0px 0px;
list-style: none;
}

.nav li
{
list-style: none;
margin: 0;
display: inline;
}

.nav li a
{
background-color:#a1aa22;
padding: 6px 8px 6px 8px;
/*border-left: 1px solid #ffffff;
border-right: 1px solid #bead05;*/
text-decoration: none;
border:thin #bead05 outset;
}

.nav li a:link { color: #33a; }
.nav li a:visited { color: #a3a; }

.nav li a:hover
{
color: #ffffad;
background-color:#dfcb14;
}
#ora {
float: right; padding: 6px 10px 6px 10px;
	color: #445;
 }
 #lst { float: left;
 margin-top:-12px;
 }

#side_menu { width: 170px; clear:left; float:left; margin:2px 10px 10px 5px; padding:0;  }
.more {
 margin-bottom:10px; margin-top:-10px; text-align:right;
}

.footer {
color:#464455;
margin:0 auto;
padding:4px 0px;
text-align:center;
border-top:thin;
-moz-border-radius: 6px;
border-radius: 6px;
background-color:#a1aa22;
}
.footer a:link
{
color: #00f;
}
.footer a:visited
 {
color: #a0a;
}
.picd {
  margin: 8px 18px;
	float: left;
	border:0px;
	box-shadow: 3px 3px 7px #777;
}
#mid {
padding:1px 20px 20px;
background:transparent url("images/k_mid_v.png") top left repeat-y;
}
.box {
background-color:#fafbfc;
border:1px solid silver;
color:#505050;
line-height:1.5em;
margin:20px;
padding:10px;
}
.geo {
	font-size:8pt; float:right; 
	margin:3px 8px 8px 3px;
}
.geo img {	box-shadow: 3px 3px 7px #222;
}

div.figure {
  float: right;
  width: 40%;
  border: thin silver solid;
  margin: 0.5em;
  padding: 0.5em;
}
div.figure p {
  text-align: center;
  font-style: italic;
  font-size: smaller;
  text-indent: 0;
}
#wleft {
float:left;
margin-left:10px;
width:450px;
}
img {
	border:0px
}

#wright {
float:left;
width:280px;
}
.kentro {
	text-align: center;
}

/**************************** desktop **************************************/
@media screen and (min-width: 780px) {
.container {
width:800px;
margin:0 auto;
margin-top:10px;
padding:0px 0px;
border:thin #bead05 outset;
border:thin #aaa solid;
-moz-border-radius: 6px;
border-radius: 6px;
-moz-box-shadow: 3px 3px 4px #463;
-webkit-box-shadow: 3px 3px 4px #463;
box-shadow: 3px 3px 4px #232;
/*background-color:#9DC7E0;*/
background-color:#fff;
}

.header-top{width:100%;height:200px;overflow:visible !important;background:url("images/Oiti_1.jpg")}
.sitelogo{width:85px;height:100px;position:absolute;z-index:1;background:url("images/easy-hiker-w.png");margin:50px 0 0 40px;}
.sitelogo2{width:580px;height:40px;position:absolute;z-index:1;margin:56px 0 0 150px; font-style:oblique; letter-spacing:1px; font-size:40px; font-weight:bold;
text-shadow: 0px 2px 3px rgba(0,0,0,.4); color:#efe;
}
.sitelogo3{width:500px;height:26px;position:absolute;z-index:1;margin:108px 0 0 160px; font-size:18px; color:#000;
text-shadow: 0px 2px 3px rgba(0,0,0,.3);}
#content {
margin:0px 20px 0px 210px;
}
#main {
background:transparent url("images/orline.png") top left repeat-y;

}
.navbar
{
background-color:#a1aa22;
color: #cad7e7;
/*border-bottom:thin  #bead05 outset;
height:20px;*/
}

.forma{width:418px;border:thin #C2BD9A outset;background-color:#E4E2D8;margin:2em 0 0;padding:10px 10px 0;}
.forma fieldset{border:solid 1px #a00;margin:0 0 20px;padding:20px 0 0 !important;}
.forma fieldset legend{color:#502020;font-weight:700;font-size:130%;margin:0 0 20px 5px !important;padding:0 2px;}
.forma label.left{float:left;width:120px;font-size:100%;margin:0 0 0 10px; padding:2px;}
.forma select.combo{width:175px;border:solid 1px #c8c8c8;font-family:verdana,arial,sans-serif;font-size:110%;padding:2px;}
.forma input.button{float:right;width:9em;margin-right:20px;background:#e6e6e6;border:solid 1px #969696;text-align:center;font-family:verdana,arial,sans-serif;color:#969696;font-size:110%;padding:1px !important;}
.forma textarea{width:275px;border:solid 1px #c8c8c8;padding:2px;}
.forma input.field{width:275px;border:solid 1px #c8c8c8;padding:2px;}
.forma input.button:hover{cursor:pointer;border:solid 1px #800;background:#ffdcdc;color:#505050;}
.footer {
color:#464455;
margin:0 auto;
padding:4px 0px;
width:800px;
text-align:center;
border-top:thin;
-moz-border-radius: 6px;
border-radius: 6px;
background-color:#a1aa22;
height:30px;
}


}

/**************************** mobile ******************************************/
@media screen and (max-width: 780px) {
   .header-top{width:100%;height:100px;overflow:visible !important;background:url("images/Oiti_mob.jpg") green no-repeat;}
.sitelogo{width:57px;height:70px;position:absolute;z-index:1;background:url("images/easy-hiker-m.png");margin:30px 0 0 20px;}
.sitelogo2{width:320px;height:30px;position:absolute;z-index:1;margin:36px 0 0 80px; font-style:oblique; letter-spacing:1px; font-size:32px; font-weight:bold;
text-shadow: 0px 2px 3px rgba(0,0,0,.4); color:#efe;
}
.sitelogo3{width:300px;height:26px;position:absolute;z-index:1;margin:80px 0 0 80px; font-size:14px; color:#000;
text-shadow: 0px 2px 3px rgba(0,0,0,.3);}

#content {
padding:10px;
line-height:1.5em;
text-align:left;
}
