html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
ol, ul {
	list-style: none;
}
*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }

html { font-size: 100%; padding: 0; margin: 0;font-family: 'Roboto', sans-serif!important;}
body {
margin:0;
padding:0;
font-family: 'Roboto', sans-serif!important;
font-size: 100%;
line-height: 1;

}

a {text-decoration:none;color:#000;}
a:hover {color:#ccc;}



strong {font-weight:700;}

h1 {font-family: 'Roboto', sans-serif!important;font-size:42px;color:#14259b;font-weight:700;text-align:center;padding-bottom:18px;margin-bottom:15px;}
#periexomeno h1 {font-family: 'Roboto', sans-serif!important;font-size:42px;color:#14259b;font-weight:700;text-align:left;padding-bottom:18px;margin-bottom:15px;}
h2 {font-family: 'Roboto', sans-serif!important;font-size:29px;font-weight:700;color:#14259b;padding:25px 0px; text-align:center;}
h3 {font-family: 'Roboto', sans-serif!important;font-size:20px;color:#000;padding:16px 0px;text-align:center;}
h4 {font-family: 'Roboto', sans-serif!important;font-size:13px;color:#000;font-weight:700;}



.container {width:1040px;margin:0 auto;position:relative;}
#topbar {height:52px;-webkit-box-shadow: 0px 0px 28px -8px rgba(0,0,0,0.51);
-moz-box-shadow: 0px 0px 28px -8px rgba(0,0,0,0.51);
box-shadow: 0px 0px 28px -8px rgba(0,0,0,0.51);position:relative;}

#menu {width:100%;text-align:center;padding-top:19px;}
#menu a {color:#fd4f00;padding:8px 23px;font-size:15px;font-weight:500;font-family: 'Roboto', sans-serif!important;}
#menu a:hover {color:#14259b;}
#menu a.ana2 {color:#14259b;}


#topbar2 {height:52px;-webkit-box-shadow: 0px 0px 28px -8px rgba(0,0,0,0.51);
-moz-box-shadow: 0px 0px 28px -8px rgba(0,0,0,0.51);
box-shadow: 0px 0px 28px -8px rgba(0,0,0,0.51);position:relative;}
#logo {width:166px;float:left;margin:5px 0 0 0;}
#menu2 {width:840px;float:left;text-align:center;padding-top:19px;}
#menu2 a {color:#fd4f00;padding:8px 23px;font-size:15px;font-weight:500;font-family: 'Roboto', sans-serif!important;}
#menu2 a:hover {color:#14259b;}
#menu2 a.ana2 {color:#14259b;}

#glossa {position:absolute;right:0;top:19px;text-align:center;width:130px;}
#glossa a {padding:3px 5px;color:#14259b;font-weight:700;font-size:13px;}
#glossa a.ana, #glossa a:hover {background:#ccc;}


#intro {text-align:center;padding-top:66px;padding-bottom:390px;background:#fdfcfc url(../img/introbg.jpg) no-repeat center bottom ;}
.intro1 {font-size:38px;color:#14259b;font-weight:400;margin-top:47px;}
.intro2 {font-size:18px;color:#14259b;font-weight:400;margin-top:40px;line-height:25px;}

@media only screen and (min-width: 280px) and (max-width: 605px)
{
#intro {text-align:center;padding-top:66px;padding-bottom:290px;background:#fdfcfc url(../img/introbg.jpg) no-repeat 50% bottom ;}
.intro1 {font-size:32px;color:#14259b;font-weight:400;margin-top:37px;}
.intro2 {font-size:16px;color:#14259b;font-weight:400;margin-top:30px;line-height:20px;}
}


.koumpi {padding:10px 50px;text-align:center;background:#e7e7e7;font-size:15px;font-weight:400;border-radius:20px;}
.koumpi:hover {background:#FD4F00;color:#fff;border:none;}




#fuits {padding-top:66px;padding-bottom:90px;background:#f6f6f2 url(../img/fruitbg.jpg) no-repeat 0 50px;}
#fuitsinside {padding-top:5px;padding-bottom:40px;background:#f6f6f2 url(../img/fruitbg2.jpg) no-repeat 0 0px;}

#crumbs {width:100%;padding:15px 0;color:#333333;font-size:12px;}
#crumbs .fa {background:transparent!important;border-radius:0px;width:19px!important;}
#crumbs a {color:#333333;}
#crumbs a:hover {color:#14259b;}


#periexomeno {background:#fff;padding:35px 30px;border-radius:10px;}
#periexomeno p {color:#333;font-size:14px;font-weight:400;line-height:21px;}
.left {width:49%;float:left;}
.right {width:49%;float:right;}
.left2 {width:45%;float:left;}
.right2 {width:45%;float:right;}


#about {padding:100px 0;}
.aristera {width:400px;float:left;}
.deksia {width:620px;float:left;}

#periexomeno2 {background:#fff;padding:10px 30px 30px 30px;border-radius:10px;margin-top:50px;}


.koumpi2 {padding:5px 23px;text-align:center;background:#fff;font-size:13px;color:#666;font-weight:400;border-radius:20px;border:1px solid #ccc;margin-top:15px;}
.koumpi2:hover {background:#FD4F00;color:#fff;border:none;}
.last {margin-right:0px!important;}




#tafroutamobi {display:none;}

.frouto {width:130px;float:left;margin-right:10px;text-align:center;padding:25px 8px 25px 8px;
background:#fff;border-radius:20px;

 -webkit-transition: all 200ms ease-in;
    -webkit-transform: scale(1); 
    -ms-transition: all 200ms ease-in;
    -ms-transform: scale(1); 
    -moz-transition: all 200ms ease-in;
    -moz-transform: scale(1);
    transition: all 200ms ease-in;
    transform: scale(1);   
}
.frouto:hover {
 z-index: 5;
    -webkit-transition: all 200ms ease-in;
    -webkit-transform: scale(1.1);
    -ms-transition: all 200ms ease-in;
    -ms-transform: scale(1.1);   
    -moz-transition: all 200ms ease-in;
    -moz-transform: scale(1.1);
    transition: all 200ms ease-in;
    transform: scale(1.1);
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.36);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.36);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.36);
	}
.frouto:hover .koumpi2 {background:#FD4F00;color:#fff;border:none;}







.frouto2 {width:120px;float:left;margin-right:5px;text-align:center;padding:25px 8px 25px 8px;
background:#fff;border-radius:20px;

 -webkit-transition: all 200ms ease-in;
    -webkit-transform: scale(1); 
    -ms-transition: all 200ms ease-in;
    -ms-transform: scale(1); 
    -moz-transition: all 200ms ease-in;
    -moz-transform: scale(1);
    transition: all 200ms ease-in;
    transform: scale(1);   
}
.frouto2:hover {
 z-index: 5;
    -webkit-transition: all 200ms ease-in;
    -webkit-transform: scale(1.1);
    -ms-transition: all 200ms ease-in;
    -ms-transform: scale(1.1);   
    -moz-transition: all 200ms ease-in;
    -moz-transform: scale(1.1);
    transition: all 200ms ease-in;
    transform: scale(1.1);
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.36);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.36);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.36);
	}
.frouto2:hover .koumpi2 {background:#FD4F00;color:#fff;border:none;}


.frouto3 {width:220px;float:left;margin-right:25px;margin-bottom:50px;text-align:center;background:#fff;border-radius:20px;padding:45px 15px 25px 15px;
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.36);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.36);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.36);
 -webkit-transition: all 200ms ease-in;
    -webkit-transform: scale(1); 
    -ms-transition: all 200ms ease-in;
    -ms-transform: scale(1); 
    -moz-transition: all 200ms ease-in;
    -moz-transform: scale(1);
    transition: all 200ms ease-in;
    transform: scale(1);   
}

.frouto3:hover {
 z-index: 5;
    -webkit-transition: all 200ms ease-in;
    -webkit-transform: scale(1.1);
    -ms-transition: all 200ms ease-in;
    -ms-transform: scale(1.1);   
    -moz-transition: all 200ms ease-in;
    -moz-transform: scale(1.1);
    transition: all 200ms ease-in;
    transform: scale(1.1);
}


#tafroutamobi .frouto3 {width:30%;float:left;margin-right:25px;margin-bottom:50px;text-align:center;background:#fff;border-radius:20px;padding:45px 15px 25px 15px;}



@media only screen and (min-width: 600px) and (max-width: 880px)
{
	#tafroutamobi .frouto3 {width:45%;float:left;margin-right:25px;margin-bottom:50px;text-align:center;background:#fff;border-radius:20px;padding:45px 15px 25px 15px;}

}

@media only screen and (min-width: 200px) and (max-width: 599px)
{
	#tafroutamobi .frouto3 {width:80%!important;float:none!important;margin:25px auto!important;}
	.frouto {width:80%;!important;float:none!important;margin:25px auto!important;text-align:center;padding:25px 8px 25px 8px;}

}






#tablemobi {display:none;}

.frouto4 {width:60%!important;float:none!important;margin:5px auto!important;text-align:center!important;padding:25px 8px 25px 8px;}
.frouto4:hover {
 z-index: 2;
    -webkit-transition: all 200ms ease-in;
    -webkit-transform: scale(1.3);
    -ms-transition: all 200ms ease-in;
    -ms-transform: scale(1.3);   
    -moz-transition: all 200ms ease-in;
    -moz-transform: scale(1.3);
    transition: all 200ms ease-in;
    transform: scale(1.3);
}






.koumpi3 {padding:10px 50px;text-align:center;background:#fff;font-size:15px;font-weight:400;border-radius:20px;color:#999;border:1px solid #ccc}
.koumpi3:hover {background:#FD4F00;color:#fff;border:none;}
.frouto3:hover .koumpi2 {background:#FD4F00;color:#fff;border:none;}





#cert {background:#f6f6f2;padding:35px 0;}
#cert2 {background:#f6f6f2;padding:35px 0;border-top:1px solid #ccc;}
#certword {font-size:16px;color:#14259b;float:left;width:20%;padding-top:34px;font-weight:500;}
#certimg {width:80%;float:left;text-align:center;}

.mesa {border-spacing: 0px;
    border-collapse: collapse;font-size:14px;font-weight:400;width:100%;}

.mesa td {padding:10px;border-bottom:1px dotted #ccc;vertical-align:middle;text-align:center;}
.mesa tr.xroma {background:#f2f2f2;}
	
	
#foot {background:#14259b;padding:45px 0 20px 0;}
#colholder {padding-bottom:0px;}
.col1 {width:250px;float:left;color:#fff;font-size:15px;border-bottom:1px solid #fff;padding-bottom:10px;}
.col2 {width:280px;float:left;color:#fff;line-height:31px;padding-top:0px;font-weight:500;}
.col3 {width:230px;float:left;color:#fff;line-height:31px;padding-top:0px;font-weight:500;}
.col4 {width:280px;float:left;color:#fff;line-height:18px;padding-top:0px;font-weight:500;}

#col4left {float:left;margin-right:0px;border-bottom:1px solid #fff;line-height:18px;padding:30px 20px 13px 0;}
#col4right {float:left;margin-top:-12px;margin-bottom:2px;border-bottom:1px solid #fff;line-height:18px;padding:30px 0 15px 0;}



.fa {border-radius:50%;width:30px;padding:6px 0px 6px 0px;background:#fff;color:#14259b;text-align:center;}
.fa:hover {border-radius:50%;width:30px;padding:6px 0px 6px 0px;background:#FD4F00;color:#fff;text-align:center;}
#colholder2 {padding-top:0px;}
.col3 a {color:#fff;font-weight:400;}
.col1b {width:310px;float:left;color:#fff;font-size:15px;}
.col2b {width:300px;float:left;color:#fff;line-height:31px;padding-top:30px;font-weight:400;}
.col3b {width:310px;float:left;color:#fff;line-height:31px;padding-top:30px;font-weight:400;}
.col4b {width:280px;float:left;color:#fff;line-height:18px;padding-top:30px;font-weight:400;}


table { 
    border-spacing: 0px;
    border-collapse: collapse;
}

.igrammi {
    padding: 10px;border:1px solid #ccc;padding:13px 0 13px 10px;width:90px;color:#666;font-size:13px;font-weight:500;
}
.igrammi2 {border:1px solid #ccc;text-align:center;vertical-align:middle;}
.contactcol {width:33%;float:left;}
.contactcolmap {width:33%;float:left;}
.contactcol h1 {font-size:19px!important;}
.contactcolmap h1 {font-size:19px!important;}
.contactcol .fa {border-radius:50%;width:30px;padding:6px 0px 6px 0px;background:#333;color:#fff;text-align:center;}
.contactcol .fa:hover {border-radius:50%;width:30px;padding:6px 0px 6px 0px;background:#FD4F00;color:#fff;text-align:center;}



.demo {
    width:100%;
}
ul {
    list-style: none outside none;
    padding-left: 0;
    margin-bottom:0;
}
li {
    display: block;
    float: left;
    margin-right: 6px;
    cursor:pointer;
}
.demo ul li img {
    display: block;
width: 100%;
}




#copy1 {font-size:11px;color:#fff;text-align:left;float:left;width:40%;margin-top:70px;}
#copy2 {font-size:11px;color:#fff;text-align:right;float:right;width:40%;margin-top:70px;}
#copy2 a{color:#fff;}
#copy2 a:hover{color:#ccc;}



#trigger-overlay {background:transparent!important;border:0;cursor:pointer;}
#trigger-overlay .fa {color:#fd4f00;background:transparent!important;border:0;font-size:28px;font-weight:400;}
#trigger-overlay:hover .fa {color:#14259B!important;background:transparent!important;border-radius:0px;}



#mobi {display:none;}
#mobi2 {display:none;}

@media only screen and (min-width: 280px) and (max-width: 900px)
{
#menu {display:none;}
#mobi {display:block;margin:0 auto;padding-top:7px;}
}
@media only screen and (min-width: 280px) and (max-width: 1120px)
{
#menu2 {display:none;}
#mobi2 {display:block;margin:0 auto 0 auto;padding-top:7px;}
}


@media only screen and (min-width: 280px) and (max-width: 1100px)
{

#tafroutamobi {display:block;}
#tafrouta {display:none;}

#table {width:100%;margin:20px auto;}
tr, td {width:100%;display:block;}

#tablemobi {display:block;}
#tablepc {display:none;}

.container {width:90%;margin:0 auto;position:relative;}

.left {width:90%;float:none;margin:20px auto;}
.right {width:90%;float:none;margin:20px auto;}
.left2 {width:90%;float:none;margin:20px auto;}
.right2 {width:90%;float:none;margin:20px auto;}


.aristera {float:none;text-align:center;width:90%;margin: 0 auto;}
.deksia {float:none;text-align:center;width:90%;margin: 40px auto 0 auto;}

.contactcol {width:300px;margin: 40px auto 0 auto;float:none;}
.contactcolmap {width:100%;margin: 40px auto 0 auto;float:none;}

#certword {font-size:16px;color:#14259b;float:none;width:90%;text-align:center;margin: 0 auto;padding-top:34px;padding-bottom:34px;font-weight:500;}
#certimg {float:none;text-align:center;width:90%;margin: 0 auto;}

	
.col1 {width:280px;float:none;color:#fff;font-size:15px;border-bottom:none;padding-bottom:10px;margin:0 auto;}
.col2 {width:280px;float:none;color:#fff;line-height:31px;padding-top:0px;font-weight:500;margin:0 auto;}
.col3 {width:280px;float:none;color:#fff;line-height:31px;padding-top:0px;font-weight:500;margin:0 auto;}
.col4 {width:280px;float:none;color:#fff;line-height:18px;padding-top:0px;font-weight:500;margin:0 auto;}
#col4left {float:none;margin:0 auto;border-bottom:1px solid #fff;line-height:18px;padding:30px 20px 13px 0;}
#col4right {float:none;margin:10px auto;border-bottom:none;line-height:18px;padding:0px 0 15px 0;}

	
#copy1 {font-size:11px;color:#fff;text-align:center;float:none;width:100%;margin-top:0px;}
#copy2 {font-size:11px;color:#fff;text-align:center;float:none;width:100%;margin-top:20px;}
	
	
	
	
	
	
	
	
	
	
	
}






