@font-face {
	font-family: alegreya_black;
	src: url("../fonts/Alegreya-Black.ttf");
}

@font-face {
	font-family: josefin_sans_regular;
	src: url("../fonts/JosefinSans-Regular.ttf");
}

body {
	background-color: gray;
}

* {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

/* Eltérő dizájn */

.article-content .text {
	text-align: left;
}

.article-content .text img {
	border-radius: 5px;
}

#logo {
	margin: 0 auto;
	text-align: center;
}

#fb {
	float: right;
	background: rgba(255,255,255,0.5);
	border-radius: 5px;
	padding:4px 10px 10px 10px;
}

.day {
	background-image: url("../img/guitar.png"), url("../img/day_bg_pattern.png");
	color: #000;
}

.day:after {
	background-image: url("../img/day_bg_pattern_2.png");
}

.night {
	background-image: url("../img/guitar.png"), url("../img/night_bg_pattern.png");
	color: #FFF;
}

.night:after {
	background-image: url("../img/night_bg_pattern_2.png");
}

.day h1 {
	color: #003366;
}

.day header {
	background-image: url("../img/day_header.png");
}

.night header {
	background-image: url("../img/night_header.png");
}

.night h1 {
	color: #FFF;
}

.day footer:before {
	background-image: url("../img/day_menu_bg.png");
}

.day footer:after {
	background: url("../img/day_trees.png");
	background-position: bottom right;
	background-repeat: no-repeat;
	content: "";
	display: block;
	position: fixed;
	width: 1366px;
	height: 124px;
	bottom: 9px;
	z-index: 9;
}

.night footer:before {
	background-image: url("../img/night_menu_bg.png");
}

.night footer:after {
	background-image: url("../img/darkness.png");
	opacity: .6;
	background-position: bottom;
	background-repeat: no-repeat;
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 213px;
	bottom: 0;
	z-index: 10;
}

/* Eltérő dizájn vége */

/* Az oldal konténere */

#content {
	position: absolute;
	top: 0;
	bottom: 0;
	background-repeat: no-repeat, repeat-x;
	background-position: bottom 120px left, top left;
	background-size: auto 40%, auto;
	max-width: 1366px;
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
}

#content:after {
	z-index: -1;
	width: 100%;
	height: 100%;
	position: absolute;
	content: "";
}

/* Az oldal konténerének vége */

/* Fejléc */

header {
	width: 100%;
	height: 483px;
	position: absolute;
	top: 0;
	background-repeat: no-repeat;
	background-position: center;
}

/* Fejléc vége */

/* Lábléc */

footer {
	position: absolute;
	width: 100%;
	bottom: 0;
}

footer:before {
	content: "";
	display: block;
	position: fixed;
	width: 100%;
	height: 213px;
	bottom: 0;
	background-repeat: no-repeat;
	z-index: 0;
}

/* Lábléc vége */

/* Tartalom szkrollozó */

#scroll_up, #scroll_down {
	width: 44px;
	height: 44px;
	margin-left: auto;
	margin-right: auto;
	left: 0;
	right: 0;
	background-repeat: no-repeat;
	background-position: bottom;
	cursor: pointer;
	position: absolute;
	display: none;
	z-index: 1000;
}

#scroll_up {
	top: 140px;
	margin-bottom: 10px;
	background-image: url("../img/scroll_up.png");	
}

#scroll_down {
	bottom: 115px;
	background-image: url("../img/scroll_down.png");
}

/* Tartalom szkrollozó vége */


/* Tartalom */

/* Let's get this party started */
::-webkit-scrollbar {
    width: 12px;
}
 
/* Track */
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: #09A8D7; 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}
::-webkit-scrollbar-thumb:window-inactive {
	background: rgba(255,0,0,0.4); 
}


#text_content {
	left: 155px;
	right: 155px;
	position: absolute;
	top: 144px;
	bottom: 175px;
	font-size: 20px;
	overflow-y: scroll;
	font-family: josefin_sans_regular;
	text-align: justify;
	z-index: 100;
	padding:5px;
}

#text_content h1 {
	font-style: italic;
	font-weight: bold;
	font-size: 26px;
}

/* Tartalon vége */


/* Menü */
nav {
	position: absolute;
	bottom: 2px;
	z-index: 100;
}

nav>ul {
	margin: 0;
	padding: 0;
}

nav>ul>li:first-of-type {
	margin-left: 96px;
}

nav>ul>li, #menu_button {
	display: inline-block;
	background-image: url("../img/button_bg.png");
	margin-left: 30px;
	position: relative;
	height: 47px;
}


#menu_button {
	display: inline-block;
	background-image: url("../img/button_bg2.png");
	margin-left: 30px;
	position: relative;
	height: 47px;
	color:#fff !important;
}

nav>ul>li>a, #menu_button {
	display: table-cell;
	text-decoration: none;
	width: 118px;
	height: 46px;
	text-align: center;
	vertical-align: middle;
	text-transform: uppercase;
	font-weight: bold;
	line-height: 15px;
	font-size: 15px;
	color: #401000;
	font-family: alegreya_black;
}

nav>ul>li>a:hover {
	text-decoration: none;
	color: #301000;
}

#menu_button {
	display: none;
}

.documents li {
	list-style: none;
}
.documents {
	margin: 0;
	padding:0;
}

h3, h1 {
	border-bottom: 2px dashed rgba(255,255,255,0.4);
	padding-bottom: 10px;
	text-transform: uppercase;
}

#cloud_menu {
	position: absolute;
	right:206px;
	top:40px;
	width:200px;
	height:50px;
	text-align: center;
	font-family: josefin_sans_regular;
	font-size:16px;
}

#cloud_menu a {	
	background: rgba(255,255,255,0.6);
	padding:5px;
	border-radius: 5px;
	margin-bottom: 5px;
}


#cloud_menu2 {
	width:255px;
	height:136px;
	text-align: center;
	font-family: josefin_sans_regular;
	font-size:16px;
	background:url('/img/cloud.png');
	display:none;
}

.cloudbutt {
	padding-top:50px;
}

#cloud_menu2 a {	
	background: rgba(255,255,255,0.6);
	padding:5px;
	border-radius: 5px;
	margin-bottom: 5px;
}

/* Menü vége */

/* Mobilnézet */

@media all and (max-width: 1024px) {
	.day {
		background-image: url("../img/day_bg_pattern.png");
	}

	.night {
		background-image: url("../img/night_bg_pattern.png");
	}

	#content {
		background-repeat: repeat-x;
		background-position: top left;
	}

	#text_content {
		left: 10px;
		right: 10px;
	}
}

@media all and (max-width: 1275px) {
	footer {
		height: 100%;
	}

	nav {
		left: -116px;
		top: 0;
		bottom: 0;
		width: 116px;
		box-shadow: inset 1px -1px 10px 0px rgba(0, 0, 0, .75);
	}

	.day nav {
		background-color: rgb(74, 59, 41);
	}

	.night nav {
		background-color: rgb(48, 60, 63);	
	}

	nav>ul>li {
		margin-left: 0 !important;
	}

	#menu_button {
		z-index: 100;
		display: block;
		position: absolute;
		bottom: 8px;
		left: 0;
		margin-left: 10px;
		content: "≡";
		font-size: 35px;
		cursor: pointer;
		line-height: 43px;
		width: 47px;
		background-size: 47px 47px;
		transition: .2s linear;
	}
}

@media all and (min-width: 1366px) {
	#content {
		left: 0 !important;
		border-left: solid 1px rgb(100, 100, 100);
		border-right: solid 1px rgb(100, 100, 100);
		box-shadow: 0px 1px 28px 0px rgba(0, 0, 0, .75);
	}	
}

@media all and (max-width: 1366px) {
	header, footer {
		background-size: auto;
	}
	

}

@media all and (max-width: 1000px) {

	#cloud_menu {
		display: none;
	}
	
	#cloud_menu2 {
		display: block;
	}
}

@media all and (max-width: 450px) {
	#logo img {
		width:80%;
		margin-top: 20px;
	}
	

	
}
/* Mobilnézet vége */






















/* TESZT */

@keyframes train_animation {
	0% {
		left: -170px;
	}
	100% {
		left: 1600px;
	}
}

@keyframes train_smoge_animation {
	0% {
		left: -51px;
	}
	10%, 30%, 50%, 70%, 90% {
		transform: rotate(-5deg);
		opacity: .1;
		transform: scale(1.3, 1.3);
		bottom: 120px;
	}
	20%, 40%, 60%, 80%, 100% {
		transform: rotate(-15deg);
		opacity: 1;
		bottom: 98px;
	}
	100% {
		left: 1719px;
	}
}

#train_container {
	z-index: 1;
	overflow: hidden;
	bottom: 0;
	width: 100%;
	height: 172px;
	position: absolute;
}

#train {
	width: 168px;
	height: 34px;
	bottom: 61px;
	position: absolute;
	left: 75px;
}

footer[data-train-animation="true"] #train {
	animation: train_animation linear 30s infinite;
	left: -100px;
}

#smoge {
	position: absolute;
	bottom: 98px;
	left: 200px;
	width: 36px;
	height: 49px;
}

footer[data-train-animation="true"] #smoge {
	animation: train_smoge_animation linear 30s infinite;
	left: -100px;
}

.day #train {
	background-image: url("../img/day_train.png")
}

.night #train {
	background-image: url("../img/night_train.png");
}

.day #smoge {
	background-image: url("../img/day_smoge.png")
}

.night #smoge {
	background-image: url("../img/night_smoge.png");
}

/* TESZT VÉGE */

/* galeria */

.gallery {
	width:100%;
	position: relative;
	text-align: left;
}


.mor_title2 {
	font-weight: bold;
}

.gallery .gallery-album{
	display: inline-block;
	width:160px;
	overflow: hidden;
	background: rgba(255,255,255,0.5);
	vertical-align: top;
	margin:10px;
    border: 1px #00A3D9 solid;
    box-shadow: 3px 3px 5px #699BAE;
	border-radius: 5px;
}

.gallery .gallery-album img {
	width:100%;
	background: #fff;
	padding:5px;
	max-height: 120px;
}

.gallery .gallery-title {
	margin-bottom:5px;
	padding:0px 5px 0px 5px;
	text-align: center;
}

.gallery .gallery-title a {
	text-decoration: none;
	color:#000;
	font-family: 'Open Sans';
	font-size: 13px;
	font-weight: bold;
}

.gallery .gallery-count {
	margin-bottom:5px;
	text-align: center;
	font-family: 'Open Sans';
	font-size: 13px;
	color: #666;
}

/*listázás*/

.gallery-album-list{
	display: inline-block;
	width:190px;
	overflow: hidden;
	vertical-align: top;
	margin:10px;
	/*box-shadow: 3px 3px 5px #699BAE;	*/
}

.gallery-album-list a {
	outline: 0;
}

.gallery-album-list img {
	width:calc(100% - 10px);
	background: #fff;
	padding:5px;
}


.gallery .gallery-title {
	margin-bottom:5px;
	padding:0px 5px 0px 5px;
	text-align: center;
	font-family: 'Open Sans';
	font-size: 13px;
	font-weight: bold;
}

.gallery-fix {
	clear: both;
}

.gallery-back {	
	text-align: center;
	float: right;
}

.gallery-back a {	
	display: block;
	text-decoration: none;
	padding:5px 15px 5px 15px;
	color: #fff;
	background: #C5181B;
}


.article-content h3 a {
	color:#000;
	font-weight: bold;
}

a.article-next {
	display: block;
	background: #fff;
	height:34px;
	max-width:100px;
	margin:0 auto;
	line-height: 34px;
	text-decoration: none;
	text-align:center;
}

a.article-next:hover {
	opacity: 0.6;
}

.article-image {
	float:left;
	width:200px;
	margin-right:10px;
}

.article-image img {
	border-radius:5px;	
}


#text_content img {
		max-width:100%;
	}
	
	
.article-content {
	text-align:left;
}