@font-face {
  font-family: Raleway;
  src: url(Raleway-Regular.ttf);
}

@font-face {
  font-family: AC-DiaryGirl;
  src: url(AC-DiaryGirl_Unicode.ttf);
}
@font-face{ 
  font-family: SansitaSwashed;
  src: url(SansitaSwashed-VariableFont_wght.ttf);
}
@font_face{
  font-family: Staatliches;
  src: url(Staatliches-Regular.ttf);
}

@font-face {
  font-family: OpenSans-Regular;
  src: url(OpenSans-Regular.ttf);
}


body{
	color: #333333;
	 background-color: #f5f8fa;
	 font-family: OpenSans-Regular, sans-serif;
   font-size: 16px;
   line-height: 24px;
	 
}
body:lang(gr) {
  font-family: Arial;
}
p{
	line-height: 160%;
}
dt{
	font-weight: bold;
}
.bottom-footer, .main-top
{
	margin-left: 2%;
	margin-right: 2%;
	display: flex;
	flex-flow: row wrap; 
	align-items: center;
}
.main-top div{
	min-width: 33%;
	text-align: center;
}
.first img{
	margin-left: -4em; 
}
.last img{
	margin-right: 3em;
  margin-left: 1em;
	float: right;
}
.main-top div.last{
	text-align: left;
}
.logo-img
{
	flex:1 1 ;
	 text-align: center;
}
.logo-img img
{
	max-height: 4em;
	padding: 1em;
  

}
.bordered
{
	border-top: 1px solid rgb(211, 224, 233);
	border-bottom: 1px solid rgb(211, 224, 233);
}

section.main{
	
		margin-left: 4%;
	margin-right: 4%;
	display: flex;
	flex-flow: row wrap; 
	align-items: center;  
}
.lang{
	margin-left: 2%;
	margin-right: 2%;
	min-width: 80vw;
	padding: 1em;
}
.lang a{
	float: right;
	
}
.lang img{
	margin-left: 1em;
  height: 1.5em;
}

.large-lang{
  background-color:#f3f6f9;
  padding: 2em;
     position: absolute;
    top: 50%;
    left: 48%;
    margin-right: -50%;
    transform: translate(-50%, -50%); 
  
}
.large-lang img{
  margin: 1em;

}
.main-internal{
	margin-left: 2%;
	margin-right: 2%;

	min-height: 60vh;
	min-width: 80vw;
	border-right: 1px solid rgb(211, 224, 233);
	border-left: 1px solid rgb(211, 224, 233);
	border-bottom: 1px solid rgb(211, 224, 233);
	background-color: white;
	padding: 1em;
	
}
div.bottom-main{
	margin-top: 2em;
	background-color: white;
}

header.main-top{
	background: white;
}
.alert-success {
    background-color: #dff0d8;
    border-color: #d6e9c6;
    color: #3c763d;
}

.alert-failure {
    background-color: #f3d7dd;
    border: 1px solid #f3153f;
    color: #f3153f;
    font-size: 120%;
}

.alert {
    padding: 15px;
    margin-bottom: 22px;
    border: 1px solid ;
    border-radius: 4px;
    }
.text-short{
	width: 2.5em;
	height: 1.5em;
	font-size: large;
	
}
textarea{
	width: 35em;
}
.simple-list{
	list-style-type: none;
}
.demo-list dt {
	margin-bottom: 0.25em;
}
.demo-list dd{
	margin-bottom: 1em;
}
ul {
	margin-top: 0;
}
.quest{
	border-collapse: collapse;
	margin-bottom: 1em;
	width: 100%;
}
.quest td{
	text-align: center;
}
.quest .content{
	min-width: 27%;  
}
.quest .left{
  text-align: right;
  padding-right: 2em;
}
.quest .right{
  text-align: left;
  padding-left: 2em
}
.quest tr{
	border-bottom: 1px solid white;
}
.quest td, .quest th{
	    border-bottom: 1px solid #ddd;
    border-top: 1px solid #ddd;
		padding-top: 0.25em;
		padding-bottom: 0.25em;
}
.main{
	margin-top: 1em;
}
input[type=submit], button{
	background-color:#01339b ;
	border-radius: 0px;
	color: white;
	padding: 0.5em;
	/* font-size: large; */
}

.radios input[type="radio"], .checks input[type="checkbox"]{
	display: none;
}
.radios .radio, .checks .radio{
	display: inline-block;
	width: 1.5em;
	height: 1.5em;
	border-radius: 0.75em;
	border: 1px solid grey;
}

.checks .radio{
	border-radius: 0.5em;
	padding: 0.25em;
	height: 1.5em;
	width: 1em;
}

.radios input[type="radio"]:checked + .radio, .checks input[type="checkbox"]:checked + .radio{
	background: #dff0d8;
}

.radios input[type="radio"]:checked + .radio::after, .checks input[type="checkbox"]:checked + .radio::after{
	content: "✔" ;
	font-size: larger;
}
.answer-line:hover, .checks:hover, li.radios:hover{
	background: #eff0e8;
}


li.checks input[type="checkbox"] + .radio::after{
	content: "." ;
	color: white;
}
li.checks input[type="checkbox"]:checked + .radio::after{
	color: rgb(99, 107, 111);
	content: "✔" ;
	
}
li.radios, li.checks{
	line-height: 2em;
	vertical-align:  bottom;
	
}
li.radios label, li.checks label{
	text-align: center;
}
input[type="text"]{
		height: 1.5em;
	font-size: 120%;
	margin-top: 0.75em;
	
}
.logout{
	float: right;
	display: inline-block;
}
.back_forward{
	float: left;
}
.clear{
	clear: both;
}
.token{
	font-weight: bold;
	padding-left: 1em;
	padding-right: 1em;
}
.required{
	font-weight: bolder;
	font-size: 1.8em;
	color: red;
}
.cond{
	color: blue;
}
.answers_line{
	background: #f5f8fa;
}

.answered_line{
	background: #e0ede8;
}
.questions .answer{
  display: block;
}

.questions dt{
  margin-top: 1em;
  margin-bottom: 0.5em;
}
.questions input[type="text"]{
  width: 4em;
}

.first-left{
  float: left;
}

.thank_you{
  font-size:larger;
  font-weight: bold;
  text-align: center;
}
th{
  vertical-align: top;
  padding-right: 0.5em;
}


h1, h2, h3, h4
{
  color: #313131;
 /* font-family: Staatliches;  */
}

.input_medium{
  width: 15em !important;
}
.hidden{
	display:none;
}
.w3-blue, .w3-hover-blue:hover {
    color: #fff!important;
    background-color: #01339b!important;
}

.lang_left{
  float: left;
}

.lang_left form{
	display: inline;
	padding-left: 1em;
}