html, body {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100vh;
/*	overflow-x: hidden; χωρίς το height */
}
*{
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-weight:300;
	font-family: 'Cardo', serif;
	vertical-align:baseline;
	line-height:2;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box
}

/*--- Gallery css ---*/
#maximize>ol,#maximize>ul,#maximize>li {
	list-style:none
}
#preloader {
	width:300px;
	height:4px;
	overflow:hidden;
	background-color:#555;
	position:absolute;
	z-index:1;
	left:0;
	right:0;
	top:48%;
	bottom:auto;
	margin:0 auto;
	-webkit-animation:hide .8s ease-out 1 forwards;
	-moz-animation:hide .8s ease-out 1 forwards;
	-ms-animation:hide .8s ease-out 1 forwards;
	-o-animation:hide .8s ease-out 1 forwards;
	animation:hide .8s ease-out 1 forwards
}

@-webkit-keyframes hide {0%{opacity:1}40%{opacity:1}100%{opacity:0}}
@-moz-keyframes hide {0%{opacity:1}40%{opacity:1}100%{opacity:0}}
@-ms-keyframes hide {0%{opacity:1}40%{opacity:1}100%{opacity:0}}
@-o-keyframes hide {0%{opacity:1}40%{opacity:1}100%{opacity:0}}
@keyframes hide {0%{opacity:1}40%{opacity:1}100%{opacity:0}}

.preloader {
	width:300px;
	height:4px;
	background-color:#f0f0f0;
	margin-top:0;
	margin-left:-300px;
	-webkit-animation:preload .5s cubic-bezier(0.215,.61,.355,1) 1 forwards;
	-moz-animation:preload .5s cubic-bezier(0.215,.61,.355,1) 1 forwards;
	-ms-animation:preload .5s cubic-bezier(0.215,.61,.355,1) 1 forwards;
	-o-animation:preload .5s cubic-bezier(0.215,.61,.355,1) 1 forwards;
	animation:preload .5s cubic-bezier(0.215,.61,.355,1) 1 forwards
}

@-webkit-keyframes preload {0%{margin-left:0}100%{margin-left:300px}}
@-moz-keyframes preload {0%{margin-left:0}100%{margin-left:300px}}
@-ms-keyframes preload {0%{margin-left:0}100%{margin-left:300px}}
@-o-keyframes preload {0%{margin-left:0}100%{margin-left:300px}}
@keyframes preload {0%{margin-left:0}100%{margin-left:300px}}

.fade-in {
	opacity:0;
	-webkit-animation:fadeIn .6s ease-in 1 forwards .6s;
	-moz-animation:fadeIn .6s ease-in 1 forwards .6s;
	-ms-animation:fadeIn .6s ease-in 1 forwards .6s;
	-o-animation:fadeIn .6s ease-in 1 forwards .6s;
	animation:fadeIn .6s ease-in 1 forwards .6s
}

@-webkit-keyframes fadeIn {0%{opacity:0}100%{opacity:1}}
@-moz-keyframes fadeIn {0%{opacity:0}100%{opacity:1}}
@-ms-keyframes fadeIn {0%{opacity:0}100%{opacity:1}}
@-o-keyframes fadeIn {0%{opacity:0}100%{opacity:1}}
@keyframes fadeIn {0%{opacity:0}100%{opacity:1}}

#maximize {
	z-index:2
}
#maximize .gallery {
	width:100%;
	height:100%;
	position:absolute
}
#maximize .fade {
	width:100%;
	height:100%;
	overflow:hidden;
	position:absolute;
	top:0;
	left:0;
	right:auto;
	bottom:auto;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	visibility:hidden;
	opacity:0;
	z-index:0;
	-webkit-transition:opacity 1s,visibility 1s;
	-moz-transition:opacity 1s,visibility 1s;
	-ms-transition:opacity 1s,visibility 1s;
	-o-transition:opacity 1s,visibility 1s;
	transition:opacity 1s,visibility 1s
}
#maximize .gallery input {
	display:none
}
.image-1{background-image:url(images/exoteriki2.jpg)}
.image-2{background-image:url(images/photos_1.jpg)}
.image-3{background-image:url(images/photos_2.jpg)}
.image-4{background-image:url(images/photos_3.jpg)}
.image-5{background-image:url(images/photos_4.jpg)}
.image-6{background-image:url(images/photos_5.jpg)}
.image-7{background-image:url(images/photos_6.jpg)}
.image-8{background-image:url(images/photos_7.jpg)}
.image-9{background-image:url(images/photos_8.jpg)}
.image-10{background-image:url(images/photos_9.jpg)}
.image-11{background-image:url(images/photos_10.jpg)}

#maximize .caption {
	position:absolute;
	bottom:7%;
	left:5%;
	right:auto;
	top:auto;
	margin:0 auto;
	width:70%;
	color:#fff
}
#maximize .caption h3 {
	font-weight:700;
	font-size:1.1em;
	text-transform:uppercase;
	letter-spacing:1px;
	-webkit-transition:all .6s ease-in-out .5s;
	-moz-transition:all .6s ease-in-out .5s;
	-ms-transition:all .6s ease-in-out .5s;
	-o-transition:all .6s ease-in-out .5s;
	transition:all .6s ease-in-out .5s
}
#maximize .caption p {
	font-size:.8em;
	padding-top:4px;
	-webkit-transition:all .6s ease-in-out .8s;
	-moz-transition:all .6s ease-in-out .8s;
	-ms-transition:all .6s ease-in-out .8s;
	-o-transition:all .6s ease-in-out .8s;
	transition:all .6s ease-in-out .8s
}
.caption a {
	display:inline;
	color:#fff;
	text-decoration:underline
}
.caption a:hover {
	text-decoration:none
}
#maximize .caption h3, #maximize .caption p {
	display:block;
	opacity:0;
	visibility:hidden
}
#maximize p.info {
	position:absolute;
	right:auto;
	left:5%;
	top:auto;
	bottom:3%;
	margin:0 auto;
	text-align:center;
	font-size:10px;
	color:#fff
}
#maximize input#image-1:checked~.image-1>.caption h3,
#maximize input#image-2:checked~.image-2>.caption h3,
#maximize input#image-3:checked~.image-3>.caption h3,
#maximize input#image-1:checked~.image-1>.caption p,
#maximize input#image-2:checked~.image-2>.caption p,
#maximize input#image-3:checked~.image-3>.caption p,
#maximize input#image-1:checked~.image-1,
#maximize input#image-2:checked~.image-2,
#maximize input#image-3:checked~.image-3,
#maximize input#image-4:checked~.image-4,
#maximize input#image-5:checked~.image-5,
#maximize input#image-6:checked~.image-6,
#maximize input#image-7:checked~.image-7,
#maximize input#image-8:checked~.image-8,
#maximize input#image-9:checked~.image-9,
#maximize input#image-10:checked~.image-10,
#maximize input#image-11:checked~.image-11 {
	visibility:visible;
	opacity:1;
	z-index:10
}
#maximize .nav-arrows {
	position:absolute;
	right:5%;
	bottom:5%;
	left:auto;
	top:auto;
	margin:0 auto;
	width:20%;
	text-align:right;
	z-index:998
}
#maximize .nav-arrows label {
	font-size:60px;
	cursor:pointer;
	color:#fff;
	padding:0 10px;
	display:inline-block;
	position:relative;
	-webkit-transition:all .2s ease-in-out;
	-moz-transition:all .2s ease-in-out;
	-ms-transition:all .2s ease-in-out;
	-o-transition:all .2s ease-in-out;
	transition:all .2s ease-in-out
}
#maximize .nav-arrows label:hover,#maximize .nav-arrows label:focus {
	color:#ccc
}

/*--- Screen ---*/
@media screen and (max-width:1366px){
	#hidden-menu article{width:30%}
	#hidden-menu input#menu-close:checked~article.expanded{left:-30%}
}
@media screen and (max-width:1024px){
/*	.image-1{background-image:url(../images/theme2/small/1.jpg)}
	.image-2{background-image:url(../images/theme2/small/2.jpg)}
	.image-3{background-image:url(../images/theme2/small/3.jpg)} */
}
@media screen and (max-width:800px),(max-height:640px){
	#hidden-menu article{width:50%}
	#hidden-menu input#menu-close:checked~article.expanded{left:-50%}
}
@media screen and (max-height:800px){
	#hidden-menu article .links,#hidden-menu .pagination{padding:10% 20%}
	#hidden-menu article .title{margin:10% 20%}
}
@media screen and (max-width:480px),(max-height:480px){
	#hidden-menu article{width:100%}
	#hidden-menu input#menu-close:checked~article.expanded{left:-100%}
	#maximize .caption{bottom:10%;width:60%}
	#maximize .caption h3{font-size:.9em}
	#maximize .caption p{font-size:.7em}
	#maximize .nav-arrows{width:30%;bottom:10%}
}
@media screen and (max-height:640px){
	#hidden-menu article .links{padding:8%}
	#hidden-menu article .links a{width:auto;margin-right:10px;overflow:visible;padding:0;display:block;float:left;margin:3% 5% 3% 0;clear:none}
	#hidden-menu article .title{margin:8%}
	#hidden-menu article p{padding:0 8%}
	#hidden-menu article .pagination{padding:15% 10%}
}
@media screen and (max-height:480px){
	#hidden-menu article .links,#hidden-menu .pagination{padding:5% 10%}
	#hidden-menu article .title{margin:5% 10%}
}