@charset "utf-8";
/*************** page3 ******************/
html{
	width: 100%;
	height: 100%;
}

@font-face {
    font-family: 'pf_din_textregular';
    src: url('fonts/pfdintext-regular.eot');
    src: url('fonts/pfdintext-regular.eot?#iefix') format('embedded-opentype'),
         url('fonts/pfdintext-regular.woff') format('woff'),
         url('fonts/pfdintext-regular.ttf') format('truetype'),
         url('fonts/pfdintext-regular.svg#pf_din_textregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

body{
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	font-family: pf_din_textregular;
	font-size: 12px;
}	

a {
	text-decoration: none;
	color: black;
}

h1{
	margin-left: 7%;
	padding-top: 10%;
	margin-bottom: 10px;
	width: 300px;
	text-align: left;
	font-size: 30px;
	color: black;
	font-weight: lighter;
}


/******************* leftContainer ***********************/

div#leftContainerEtaireia {
	background: url(../img/page2_1.jpg) no-repeat;
	background-size: cover;
	width: 17.9%;
	height: 110%;
	float: left;
}

div#leftContainerTeleytaiaNea {
	background: url(../img/page3_1.jpg) no-repeat;
	background-size: cover;
	width: 17.9%;
	height: 100%;
	float: left;
}

div#leftContainerHliakiEenergeia {
	background: url(../img/page4_1.jpg) no-repeat;
	background-size: cover;
	width: 17.9%;
	height: 100%;
	float: left;
}

div#leftContainerPrasiniAnaptuksi {
	background: url(../img/page5_1.jpg) no-repeat;
	background-size: cover;
	width: 17.9%;
	height: 100%;
	float: left;
}

div#leftContainerEpikoinonia {
	background: url(../img/page6_1.jpg) no-repeat;
	background-size: cover;
	width: 17.9%;
	height: 100%;
	float: left;
}


/******************* mainContainer ***********************/

div#mainContainer {
	min-width: 280px;
	width: 28.7%;
	height: 100%;
	float: left;
}

div#topSection{
	padding-top: 8%;
	height: 15%;
	min-height: 90px;
}

#arrowlist { 
	width: 50%;
	float: left;
	height: 68.2%;
	margin-top: 2.15%;
	margin-bottom: 4.15%;
	padding-left: 7%;
}

#arrowlist li{
	height: 28%;
}

#arrowlist li a:hover{
	font-weight:bold;
}

#arrowlist li span{
	background-color: black;
	color: white;
	padding: 2%;
}

#arrowlist li a{
	padding: 1%;
}

div#centerSection{
    /* height: 65.4%; */	
	min-height: 300px;
}

div#centerSection a{
	line-height: 40px;
}

div#centerSection a:hover{
	font-weight: bold;
}

#fixtext{
	font-size: 14px;
	padding: 15px 0;
}

div#mainContainer p{
	width: 280px;
	padding-left: 7%;
	line-height: 1.5em;
	text-align: left;
}

div#logo{
	height: 11%;
}

#logo img{
	margin-left: 7%;
	
}


/******************* rightContainer ***********************/

div#rightContainer {
	min-width: 150px;
	width: 53.4%;
	height: 100%;
	float: left;
}

#rightContainerEtaireia{
	background: url(../img/page2_2.jpg) no-repeat;
	background-size: cover;
	min-width: 150px;
	width: 53.4%;
	height: 110%;
	float: left;
}

#rightContainerTeleytaiaNea{
	background: url(../img/page3_2.jpg) no-repeat;
	background-size: cover;
	min-width: 150px;
	width: 53.4%;
	height: 100%;
	float: left;
}

#rightContainerHliakiEenergeia{
	background: url(../img/page4_2.jpg) no-repeat;
	background-size: cover;
	min-width: 150px;
	width: 53.4%;
	height: 100%;
	float: left;
}

#rightContainerPrasiniAnaptuksi{
	background: url(../img/page5_2.jpg) no-repeat;
	background-size: cover;
	min-width: 150px;
	width: 53.4%;
	height: 100%;
	float: left;
}

#rightContainerEpikoinonia{
	background: url(../img/page6_2.jpg) no-repeat;
	background-size: cover;
	min-width: 150px;
	width: 53.4%;
	height: 100%;
	float: left;
}

/******************* Arxikh (index.html) ***********************/


div#mainContainerArxikh{
	background: url(../img/image.jpg) no-repeat;
	background-size: cover;
	height: 100%;
}

div#leftContainerArxikh {
	width: 23%;
	height: 100%;
	float: left;
}

div#ContainerArxikh{
	position: relative;
	background: #414143;
	width: 35%;
	min-width: 280px;
	height: 65%;
	float: left;
}

div#topSectionArxikh{
	padding-top: 7%;
}

#arrowlistArxikh { 
	padding-left: 7%;
}

#arrowlistArxikh li{
	line-height: 25px;
}

#arrowlistArxikh li a:hover{
	background-color: #ffffff;
	color: #000000;
	font-weight:bold;
}

#arrowlistArxikh li a{
	color: #ffffff;
	padding: 0.5%;
}

#topSectionArxikh img{
	position: absolute;
	bottom: -3%;
	left: 20%;
	width: 60%;
}