@font-face {
    font-family: 'Promocyja';
    src: url('fonts/PromocyjaRegular.eot');
    src: url('fonts/PromocyjaRegular.eot?#iefix') format('embedded-opentype'),
        url('fonts/PromocyjaRegular.woff2') format('woff2'),
        url('fonts/PromocyjaRegular.woff') format('woff'),
        url('fonts/PromocyjaRegular.ttf') format('truetype'),
        url('fonts/PromocyjaRegular.svg#PromocyjaRegular') format('svg');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Open Sans';
    src: url('fonts/OpenSans-Light.eot');
    src: url('fonts/OpenSans-Light.eot?#iefix') format('embedded-opentype'),
        url('fonts/OpenSans-Light.woff2') format('woff2'),
        url('fonts/OpenSans-Light.woff') format('woff'),
        url('fonts/OpenSans-Light.ttf') format('truetype'),
        url('fonts/OpenSans-Light.svg#OpenSans-Light') format('svg');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Alegreya Sans';
    src: url('fonts/AlegreyaSans-Light.eot');
    src: url('fonts/AlegreyaSans-Light.eot?#iefix') format('embedded-opentype'),
        url('fonts/AlegreyaSans-Light.woff2') format('woff2'),
        url('fonts/AlegreyaSans-Light.woff') format('woff'),
        url('fonts/AlegreyaSans-Light.ttf') format('truetype'),
        url('fonts/AlegreyaSans-Light.svg#AlegreyaSans-Light') format('svg');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Exo 2.0';
    src: url('fonts/Exo20-Light.eot');
    src: url('fonts/Exo20-Light.eot?#iefix') format('embedded-opentype'),
        url('fonts/Exo20-Light.woff2') format('woff2'),
        url('fonts/Exo20-Light.woff') format('woff'),
        url('fonts/Exo20-Light.ttf') format('truetype'),
        url('fonts/Exo20-Light.svg#Exo2.0-Light') format('svg');
    font-weight: 300;
    font-style: normal;
}

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

@-webkit-keyframes spin {
	0% {
		-webkit-transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
	}
}

@-webkit-keyframes falling {
	0% {
		opacity: 1;
		-webkit-transform: translate(0, 0px) rotateZ(0deg);
	}
	75% {
		opacity: .75;
		-webkit-transform: translate(100px, 1000px) rotateZ(270deg);
	}
	100% {
		opacity: 0;
		-webkit-transform: translate(150px, 1000px) rotateZ(360deg);
	}
}

@media all {
	* {
		box-sizing: border-box;
	}
	
	html {
	    background-image: url("/background.jpg");
	    background-attachment: fixed;
	    background-clip: border-box;
	    background-repeat: no-repeat;
	    overflow: hidden;
	    background-origin: content-box;
		background-position: center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		height: 100%;
	}
	
	body {
		line-height: 1.5;
	}
	
	[contenteditable], [required] {
		background-color: #fffaaa;
	}

	div > p::first-letter {
		font-family: 'Promocyja', sans-serif;
		font-size: 1.5em;
		font-weight: bold;
		line-height: .5;
	}

	[onclick], [onmousedown] {
		cursor: pointer;
	}

	[contenteditable] {
		min-height: 2em;
		border-radius: 4px;
		margin: 5px 0px;
		padding: 5px;

		-webkit-transition: all .5s ease-out;
		-moz-transition: all .5s ease-out;
		-ms-transition: all .5s ease-out;
		-o-transition: all .5s ease-out;
		transition: all .5s ease-out;
	}
	
	[contenteditable]:hover {
		box-shadow: inset 0px 0px 5px #20008f, 0px 0px 5px #20008f;
	}

	a {
		text-decoration: none;
	}
	
	input, select {
		border: none;
		color: inherit;
		padding: 5px;
		border-radius: 4px;
		margin: 2px;
		font-size: 1em;
		box-shadow: inset 0px 0px 5px, 0px 0px 5px;
		
		-webkit-transition: all .5s ease-out;
		-moz-transition: all .5s ease-out;
		-ms-transition: all .5s ease-out;
		-o-transition: all .5s ease-out;
		transition: all .5s ease-out;
	}

	.bigimage_hidden {
		width: 0px;
		height: 0px;
		opacity: 0;
	}
	
	.bigimage {
		width: 100%;
		height: 100%;
		opacity: 1;
	}
	
	#cover {
		background-color: #0b0b0b;
		position: absolute;
		left: 0px;
		right: 0px;
		top: 0px;
		bottom: 0px;
		z-index: 0;
		opacity: .85;
	}
	
	#galery img {
		z-index: 1;
	}
	
	#menuitems {
		position: absolute;

		-webkit-transition: all .5s ease-out;
		-moz-transition: all .5s ease-out;
		-ms-transition: all .5s ease-out;
		-o-transition: all .5s ease-out;
		transition: all .5s ease-out;
	}
	
	#showmenu {
		position: absolute;
		font-size: 1.2em;
		right: 5px;
		margin: 5px;
		top: 0px;
		bottom: 0px;
		display: table;
	}

	#login {
		z-index: 1;
		padding: 5px;
		-webkit-transition: all 0.8s ease-out;
		-moz-transition: all 0.8s ease-out;
		-ms-transition: all 0.8s ease-out;
		-o-transition: all 0.8s ease-out;
		transition: all 0.8s ease-out;
	}
/*	
	#login:first-child {
		margin-top: 20px;
	}
*/
	#loginform {
		position: relative;
		top: 10px;
	}

	#loginbar {
		display: inline-block;
		position: absolute;
		left: 5px;
		top: 5px;
	}
	
	#loginbar input {
		margin-bottom: 5px;
		text-align: center;
		-webkit-transition: all 0.8s ease-out;
		-moz-transition: all 0.8s ease-out;
		-ms-transition: all 0.8s ease-out;
		-o-transition: all 0.8s ease-out;
		transition: all 0.8s ease-out;
		position: relative;
		width: 200px;
		z-index: 1;
		display: block;
	}
/*
	#login:first-child {
		margin-top: 15px;
	}
*/	
	#login:hover input {
/*		width: 200px;*/
/*		opacity: .9;*/
	}
/*	
	.showlogin input {
		width: 200px;
		opacity: .9;
	}
*/
	.hidelogin {
/*		opacity: 0;
		top: -50px;
		left: -220px;*/
		display: none;
	}
	
	#login::before {
		font-family: "themify";
		content: "\e602";
		font-size: 1.2em;
	}
	
	#showmenu::before {
		font-family: "themify";
		position: relative;
		font-size: 1.2em;
		display: table-cell;
		color: #20008f;
	}

	#showmenu::before {
		content: "\e68e";
		right: 5px;
/*		vertical-align: middle;
		text-align: center;*/
	}

	.share {
		position: absolute;
		bottom: -20px;
		text-align: center;
		left: 0px;
		right: 0px;
		display: table;
		background-color: #f8f8f8;
		opacity: .85;
	}

	.share a {
		display: table-cell;
		color: transparent;
		max-width: 40px;
		white-space: nowrap;
		height: 1em;
	}
	
	.share a::before {
		font-family: "themify";
		color: #20008f;
		display: inline-block;
		text-align: center;
		width: 100%;
		vertical-align: middle;
	}
	
	.share a[title="E-mail"]::before {
		content: "\e75a";
	}
	
	.share a[title="Facebook"]::before {
		content: "\e741";
	}
	
	.share a[title="Twitter"]::before {
		content: "\e72a";
	}
	
	.share a[title="Tumblr"]::before {
		content: "\e72c";
	}
	
	.share a[title="Pinterest"]::before {
		content: "\e731";
	}
	
	.share a[title="Clipboard"]::before {
		content: "\e62d";
	}

	#image {
		background-size: contain;
		background-repeat: no-repeat;
		background-position-x: center;
		background-position-y: center;
/*		max-height: calc(100% - 20px);
		max-width: calc(100% - 20px);*/
		margin: auto auto;
		z-index: 1;
		position: absolute;
		top: 0px;
		bottom: 0px;
		left: 0px;
		right: 0px;
	}
	
	#image .share {
		bottom: 0px;
	}

	.bigimage span {
		font-family: "themify";
		color: #8f8f8f;
		display: inline-flex;
		position: absolute;
		top: 0px;
		bottom: 0px;
		font-size: 2em;
		padding: 5px;
		z-index: 1;
	}

	#prev {
		left: 0px;
	}
	
	#prev::before {
		content: "\e65e";
		display: flex;
		align-items: center;
	}

	#next {
		right: 0px;
	}
	
	#next::before {
		content: "\e65d";
		display: flex;
		align-items: center;
	}
	
	#albums div {
		display: inline-block;
		margin: 15px;
	}
	
	#albums p {
		line-height: 1;
		padding: 0;
		margin: 0;
	}

	.imageframe {
		display: inline-block;
		margin: 10px;

		-webkit-transition: all .5s ease-out;
		-moz-transition: all .5s ease-out;
		-ms-transition: all .5s ease-out;
		-o-transition: all .5s ease-out;
		transition: all .5s ease-out;
	}
	
	.imageframe:hover {
/*		background-color: #f8f8f8;*/
		color: #20008f;
	}
	
	.imageframe:hover * {
		opacity: 1;
		box-shadow: inset 0px 0px 5px, 0px 0px 5px;
	}
	
	.imageframe span, .imageframe label/*, .imageframe div*/ {
		border-radius: 4px;
		width: 25px;
		height: 25px;
		opacity: .5;

		-webkit-transition: all .5s ease-out;
		-moz-transition: all .5s ease-out;
		-ms-transition: all .5s ease-out;
		-o-transition: all .5s ease-out;
		transition: all .5s ease-out;
	}

	input:hover, select:hover {
		color: #20008f;
	}
	
	.delete {
		font-size: 0.85em;
		position: absolute;
		top: 5px;
		right: 5px;
		background-color: #f8f8f8;
		padding: 2px;
	}
	
	.delete:hover {
		color: #20008f;
	}

	.delete::before {
		font-family: "themify";
		content: "\e605";
	}
	
	.uploadAttachment {
		font-size: 0.85em;
		position: absolute;
		top: 5px;
		left: 5px;
		cursor: pointer;
		background-color: #f8f8f8;
		padding: 2px;
	}
	
	.uploadAttachment:hover {
		color: #20008f;
	}

	.uploadAttachment::before {
		font-family: "themify";
		content: "\e647";
	}
	
	.rotateLeft {
		font-size: 0.85em;
		position: absolute;
		top: calc(50% - 12.5px);
		left: 5px;
		background-color: #f8f8f8;
		padding: 2px;
	}

	.rotateLeft::before {
		font-family: "themify";
		content: "\e6bc";
	}
	
	.rotateLeft:hover {
		color: #20008f;
	}
	
	.rotateRight {
		font-size: 0.85em;
		position: absolute;
		top: calc(50% - 12.5px);
		right: 5px;
		background-color: #f8f8f8;
		padding: 2px;
	}

	.rotateRight::before {
		font-family: "themify";
		content: "\e6bd";
	}
	
	.rotateRight:hover {
		color: #20008f;
	}
	
	.addImageNote {
		font-size: 0.85em;
		position: absolute;
		bottom: 5px;
		right: 5px;
		z-index: 1;
		background-color: #f8f8f8;
		padding: 2px;
	}

	.addImageNote::before {
		font-family: "themify";
		content: "\e717";
	}
	
	.addImageNote:hover {
		color: #20008f;
	}
	
	.makeDefault {
		font-size: 0.85em;
		position: absolute;
		bottom: 5px;
		left: 5px;
		z-index: 1;
		background-color: #f8f8f8;
		padding: 2px;
	}
	
	.makeDefault:hover {
		color: #20008f;
	}

	.makeDefault::before {
		font-family: "themify";
		content: "\e71e";
	}

	.imageComment {
		display: block;
		position: absolute;
		width: 200px;
		z-index: 99;
	}

	img.embedded {
		max-height: 70vh;
		max-width: 70vw;
	}

	.namecard {
		background-image: url("?profileimage=Profilkép");
		background-size: cover;
		background-repeat: no-repeat;
		background-position-x: center;
		background-position-y: center;
		width: 50px;
		height: 50px;
		margin: 5px;
		border-radius: 5px 0px 5px 0px;
		box-shadow: inset 0px 0px 5px, 0px 0px 5px;
		float: right;
		border: 1px solid;
	}
	
	.namecard::after {
		content: attr(title);
		position: absolute;
		left: 0px;
		right: 0px;
		bottom: -25px;
		font-size: .85em;
	}
	
	span.edit {
		display: inline-block;
		color: #20008f;
		margin: 5px;
	}
	
	#albums {
		display: table;
		width: 100%;
	}
	/*
	.frame:hover {
		color: #f8f8f8;
		background-color: #20008f;
	}
*/	
	.frame:hover {
		background-color: #f8f8f8;
		color: #20008f;
	}

	.frame {
		min-width: 150px;
/*		height: 180px;
		border: 1px solid;*/
		border-radius: 4px;
		display: flex;
/*		align-items: center;
		box-shadow: 0px 0px 5px inset, 0px 0px 5px;
*/
		-webkit-transition: all .5s ease-out;
		-moz-transition: all .5s ease-out;
		-ms-transition: all .5s ease-out;
		-o-transition: all .5s ease-out;
		transition: all .5s ease-out;
	}
	
	.frame img {
		margin-bottom: 20px;
	}
	
	.frame p {
		position: absolute;
		bottom: 0px;
		width: 100%;
	}

	.frame::before {
		content: attr(data-item)" alkotás";
		position: absolute;
		font-size: 0.7em;
		top: 20px;
		left: 5px;
		/*border: 1px solid;*/
		background-color: #f8f8f8;
		opacity: 0.85;
		padding: 2px;
	}
/*	
	.frame::before:hover {
		color: #20008f;
		background-color: #f8f8f8;
	}
*/	
	.files {
		display: inline-block;
		position: absolute;
		right: 10px;
		bottom: 35px;
		color: #8f8f8f;
		text-align: right;
	}
	
	.files::before {
		font-family: "themify";
		content: "\e6a7";
	}

	.files a {
		display: block;
		position: relative;
		font-family: "Open Sans";
		color: #8f8f8f;
		cursor: pointer;
		list-style-position: inside;
		padding: 5px;
		z-index: 1;
	}
	
	label.uploadLabel {
		display: inline-block;
		padding: 10px;
		margin: 5px;
		/*border: 1px solid;*/
		border-radius: 4px;
		box-shadow: 0px 0px 5px inset, 0px 0px 5px;
		cursor: pointer;

		-webkit-transition: all .5s ease-out;
		-moz-transition: all .5s ease-out;
		-ms-transition: all .5s ease-out;
		-o-transition: all .5s ease-out;
		transition: all .5s ease-out;
	}
	
	label.uploadLabel:hover {
		color: #f8f8f8;
		background-color: #20008f;
	}
	
	label img {
		display: block;
	}
	
	input[type="file"] {
		display: none;
	}

	div {
		position: relative;
	}
	
	#exit {
		position: absolute;
		left: 0px;
		top: 45px;
		z-index: 1;
		color: #20008f;
		font-weight: bold;
		padding: 5px;
		font-size: 0.85em;
	}

	::-webkit-input-placeholder {
	   text-align: center;
	}

	:-moz-placeholder { /* Firefox 18- */
	   text-align: center;  
	}

	::-moz-placeholder {  /* Firefox 19+ */
	   text-align: center;  
	}

	:-ms-input-placeholder {  
	   text-align: center; 
	}
/*
	.note {
		background-color: transparent;
		display: inline-block;
		line-height: 1.5;
		max-width: 45%;
		padding: 25px;
		-webkit-transition: all 1.2s ease-out;
		-moz-transition: all 1.2s ease-out;
		-ms-transition: all 1.2s ease-out;
		-o-transition: all 1.2s ease-out;
		transition: all 1.2s ease-in-out;
		vertical-align: top;
	}*/

	#totop {
		display: inline-block;
		cursor: pointer;
		margin: 5px;
		padding: 5px;
		position: absolute;
		bottom: 35px;
		right: 10px;
		z-index: 99;
		font-size: 2em;
		width: 60px;
	}
	
	#totop::before {
		font-family: "themify";
		content: "\e65c";
	}
	
	a[type]::after {
		margin-left: 5px;
	}
	
	a[type="image"]::after {
		font-family: "themify";
		content: "\e633";
	}
	
	a[type="audio"]::after {
		font-family: "themify";
		content: "\e689";
	}
	
	a[type="video"]::after {
		font-family: "themify";
		content: "\e6ce";
	}
	
	a[type="link"]::after {
		font-family: "themify";
		content: "\e665";
	}
	
	a[type="youtube"]::after {
		font-family: "themify";
		content: "\e728";
	}

	a[type="vimeo"]::after {
		font-family: "themify";
		content: "\e729";
	}
/*
	.imageframe div {
		display: block;
		position: absolute;
		width: auto;
		top: 30px;
		left: 5px;
		z-index: 100;
		height: auto;
		font-size: 0.7em;
	}
	
	.imageframe:hover div {
		box-shadow: none;
	}
*/
	.imageframe div input {
		background-color: #fffaaa;
		margin-top: 5px;
	}
	
	.imageframe div label {
		background-color: #f8f8f8;
		padding: 3px;
		cursor: pointer;
		display: block;
		width: 100%;
	}
}

@media screen {
	body {
	}

	#page {
		color: #7b7b7b;
		font-family: 'Open Sans', sans-serif;
		font-size: 1em;
		margin: 0px auto;
		opacity: 0;
		position: absolute;
		left: 10px;
		right: 10px;
		top: 10px;
		padding: 0px;
		bottom: 20px;
		text-align: justify;
		max-width: 1000px;
		word-wrap: break-word;

		-webkit-transition: opacity 1s ease-out;
		-moz-transition: opacity 1s ease-out;
		-ms-transition: opacity 1s ease-out;
		-o-transition: opacity 1s ease-out;
		transition: opacity 1s ease-out;
	}

	a {
		color: #8f2000;
	}

	.image {
		width: 200px;
		height: 140px;
		background-position: center;
		background-size: contain;
		border: 1px solid;
		display: inline-block;
		box-shadow: 0px 0px 5px inset, 0px 0px 5px;
		margin: 10px;
		background-repeat: no-repeat;
	}

	img {
		max-width: 200px;
		max-height: 140px;
		border: 1px solid;
		box-shadow: 0px 0px 5px inset, 0px 0px 5px;
		margin: 10px;

		-webkit-transition: all 1s ease-out;
		-moz-transition: all 1s ease-out;
		-ms-transition: all 1s ease-out;
		-o-transition: all 1s ease-out;
		transition: all 1s ease-out;
	}

	#menu {
		text-align: right;
		z-index: 1;
		position: absolute;
		left: 35px;
		right: 0px;
		top: 0px;
		padding: 0px;
	}
	
	#menuitems {
		display: inline-block;
		right: 0px;
	}

	#info {
		z-index: 0;
		max-height: 50px;
		padding-left: 50px;
		text-shadow: 0px 0px 5px;
	}

	#info span {
		font-family: 'Promocyja', sans-serif;
		font-size: 50px;
		color: #8f2000;
	}

	#info a {
		font-size: 10px;
	}

	#content {
		background-color: #ffffff;
		border: 1px solid;
		box-shadow: 0px 0px 5px inset, 0px 0px 5px;
		overflow: auto;
		position: absolute;
		left: 0px;
		right: 0px;
		top: 50px;
		padding: 10px;
		bottom: 0px;
	}

	.menuitem {
		vertical-align: top;
		display: inline-table;
		position: relative;
		background-color: #ffffff;
	}

	.menuitem > span {
		display: block;
	}

	.button, .menuitem {
		font-family: 'Open Sans', sans-serif;
		box-shadow: 0px 0px 5px inset, 0px 0px 5px;
		cursor: pointer;
		border-radius: 5px 0px 5px 0px;
		text-align: center;
		display: inline-block;
		border: 1px solid;
		padding: 5px;
		width: 120px;
		margin: 5px;
		max-height: 40px;
	}

	.button:hover, .menuitem:hover {
		color: #f00b0b;
	}

	.menuitem > span::after {
		background-color: #ffffff;
		content: attr(title);
		font-size: 0.7em;
		font-family: sans-serif;
		position: absolute;
		left: 2px;
		top: 2px;
		right: 2px;
		bottom: 2px;
		display: flex;
		align-items: center;
		text-align: center;
		opacity: 0;
		-webkit-transition: opacity 1s ease;
		-moz-transition: opacity 1s ease;
		-ms-transition: opacity 1s ease;
		-o-transition: opacity 1s ease;
		transition: opacity 1s ease;
	}

	.menuitem > span:hover::after {
		opacity: 1;
	}
	
	.button::first-letter, .menuitem > span::first-letter {
		font-family: 'Promocyja', sans-serif;
		font-size: 1.5em;
		font-weight: bold;
	}

	#banner {
		font-family: 'Promocyja', sans-serif;
		text-align: center;
		position: absolute;
		top: 0px;
		left: 0px;
		bottom: 0px;
		right: 0px;
		z-index: 1;
		text-align: center;
		background-color: #ffffff;
		border: 1px solid;
		box-shadow: 0px 0px 5px inset, 0px 0px 5px;
		overflow: auto;

		-webkit-transition: opacity 1s ease-out;
		-moz-transition: opacity 1s ease-out;
		-ms-transition: opacity 1s ease-out;
		-o-transition: opacity 1s ease-out;
		transition: opacity 1s ease-out;
	}
	
	#bannertitle {
		font-size: 7vw;
	}
	
	#banner p {
		color: #8f2000;
	}

	.note .title, .note .date {
		display: block;
		text-align: center;
	}
	
	#uploads {
		text-align: center;
	}
	
	fieldset {
		text-align: justify;
		margin-bottom: 5px;
	}
	
	fieldset label {
		font-weight: bold;
		text-align: left;
		display: block;
	}
	
	fieldset .button {
		text-align: center;
	}
	
	.title {
		font-family: "Promocyja",sans-serif;
		font-size: 2em;
		text-align: left;
	}
	
	#galery {
		max-height: 100%;
		max-width: 100%;
		position: absolute;
	    overflow: hidden;
		top: 0px;
		left: 0px;
		right: 0px;
		bottom: 0px;
		text-align: center;

		-webkit-transition: all 1s ease-out;
		-moz-transition: all 1s ease-out;
		-ms-transition: all 1s ease-out;
		transition: all 1s ease-out;
	}

	#toolbar {
		display: table;
		height: 30px;
		font-family: "themify";
		vertical-align: middle;
		text-align: left;
		margin: 0px auto;
	}
	
	#toolbar input, #toolbar select, #toolbar span, #toolbar label {
		vertical-align: middle;
		border: 1px solid;
		border-radius: 5px;
		text-align: center;
		margin-right: 3px;

		-webkit-transition: all .5s ease-out;
		-moz-transition: all .5s ease-out;
		-ms-transition: all .5s ease-out;
		transition: all .5s ease-out;
	}
	
	#toolbar span, #toolbar label {
		height: 30px;
		width: 30px;
		box-shadow: inset 0px 0px 5px, 0px 0px 5px;
	}

	[contenteditable] {
		border-radius: 4px;
		box-shadow: inset 0px 0px 5px, 0px 0px 5px;
	}
	
	#toolbar span:hover, #toolbar label:hover {
		color: #20008f;
	}
	
	#toolbar input, #toolbar span, #toolbar label {
		display: inline-block;
	}

	input[type="color"], input[type="range"], input[type="file"] {
		-webkit-appearance: none;
		border: none;
		width: 30px;
		height: 30px;
	}

	input[type="color"]::-webkit-color-swatch-wrapper {
/*		padding: 0;*/
	}

	input[type="color"]::-webkit-color-swatch {
/*		border: none;*/
	}
	
	#justifyLeft::before {
		content: "\e6c2";
		vertical-align: middle;
		text-align: center;
	}
	
	#justifyRight::before {
		content: "\e6c1";
		vertical-align: middle;
		text-align: center;
	}
	
	#justifyCenter::before {
		content: "\e6c4";
		vertical-align: middle;
		text-align: center;
	}
	
	#justifyFull::before {
		content: "\e6c3";
		vertical-align: middle;
		text-align: center;
	}
	
	#indent::before {
		content: "\e6d9";
		vertical-align: middle;
		text-align: center;
	}
	
	#outdent::before {
		content: "\e6da";
		vertical-align: middle;
		text-align: center;
	}
	
	#insertImage::before {
		content: "\e633";
		vertical-align: middle;
		text-align: center;
	}
	
	#copy::before {
		content: "\e6a3";
		vertical-align: middle;
		text-align: center;
	}
	
	#paste::before {
		content: "\e6b4";
		vertical-align: middle;
		text-align: center;
	}
	
	#bold::before {
		font-family: 'Open Sans', sans-serif;
		content: "F";
		font-weight: bold;
		vertical-align: middle;
		text-align: center;
	}
	
	#italic::before {
		font-family: 'Open Sans', sans-serif;
		content: "D";
		font-style: italic;
		vertical-align: middle;
		text-align: center;
	}

	#underline::before {
		font-family: 'Open Sans', sans-serif;
		content: "A";
		text-decoration: underline;
		vertical-align: middle;
		text-align: center;
	}

	#https {
		font-size: .85em;
		font-family: 'Open Sans';
	}

	#https::before {
		font-family: "themify";
		content: "\e62b";
		vertical-align: middle;
		text-align: center;
	}
	
	#showmenu {
		display: none;
	}
	
	.message, .note {
		background-color: #ffffff;
		margin: 5px;
		padding: 5px;
	}

	.message:nth-child(even) {
		background-color: #f8f8f8;
	}
	
	.name, .title {
		font-weight: bold;
		color: #8f2000;
		margin-right: 5px;
	}
	
	.date {
		font-size: .7em;
	}
	
	.data {
		margin: 5px 0px;
	}
	
	.loader {
		border: 16px solid #f3f3f3;
		border-radius: 50%;
		border-top: 16px solid #00208f;
		border-bottom: 16px solid #00208f;
		width: 85px;
		height: 85px;
		-webkit-animation: spin 1s linear infinite;
		-moz-transition: spin 1s linear infinite;
		-ms-transition: spin 1s linear infinite;
		-o-transition: spin 1s linear infinite;
		animation: spin 1s linear infinite;
		box-shadow: inset 0px 0px 5px, 0px 0px 5px;
		margin: 0px auto;
	}
	
	#filestatus div {
		position: relative;
		padding: 2px;
		font-size: 0.7em;
		border: 1px solid;
		line-height: 1;
	}
	
	#filestatus span {
		background-color: #8f2000;
		position: absolute;
		left: 0px;
		top: 0px;
		height: 100%;
		width: 0px;
	}
	
	.iniciale {
		font-size: 1em;
		text-align: center;
	}
	
	.iniciale::first-letter {
		font-family: 'Promocyja', sans-serif;
		font-size: 2em;
		font-weight: bold;
	}

	.falling {
		display: none;
		position: absolute;
		top: 0px;
		bottom: 0px;
		left: 0px;
		right: 0px;
		z-index: -1;
	}

	.falling span {
		display: inline-block;
		width: 20px;
		height: 20px;
		margin: -280px 40px 54px -34px;

		background: url("snow.png");
		background-size: contain;
		-webkit-animation: falling 10s infinite linear;
		-moz-animation: falling 10s infinite linear;
		-ms-transition-delay: falling 10s infinite linear;
		-o-transition: falling 10s infinite linear;
		transition: falling 10s infinite linear;
	}

	.falling span:nth-child(5n+5) {
		-webkit-animation-delay: 1s;
		-moz-animation-delay: 1s;
		-ms-transition-delay: 1s;
		-o-transition: 1s;
		transition: 1s;
	}

	.falling span:nth-child(3n+2) {
		-webkit-animation-delay: 1.5s;
		-moz-animation-delay: 1.5s;
		-ms-transition-delay: 1.5s;
		-o-transition: 1.5s;
		transition: 1.5s;
	}
	.falling span:nth-child(2n+5) {
		-webkit-animation-delay: 1.7s;
		-moz-animation-delay: 1.7s;
		-ms-transition-delay: 1.7s;
		-o-transition: 1.7s;
		transition: 1.7s;
	}

	#menuitems.showmenuitems {
	}

	#menuitems.hidemenuitems {
	}
	
	div.cdate2a {
		display: inline-block;
	}

	span.cdate {
		position: absolute;
		font-size: 8.5px;
		right: 15px;
		bottom: 20px;
		width: 24px;
		height: auto;
		display: table-caption;
		background-color: #b8b8b8;
		padding: 2px;
		opacity: .85;
		color: #ffffff;
		box-shadow: 0px 0px 2px;
	}

	span.seen {
		position: absolute;
		font-size: 8.5px;
		left: 15px;
		bottom: 20px;
		display: table-caption;
		background-color: #b8b8b8;
		padding: 2px;
		opacity: .85;
		color: #ffffff;
		box-shadow: 0px 0px 2px;
	}
}

@media only screen and (max-device-width: 850px) and (min-device-width: 300px) {
	* {
		box-sizing: border-box;
	}

	html {
/*		background: url("/DSC_0003_2.jpg") no-repeat center center fixed;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		height: 100%;
		overflow: hidden;*/
	}

	body {
		height: 100%;
		overflow: hidden;
		-webkit-text-size-adjust: none;
	}

	#page {
		width: 100%;
		left: 0px;
		top: 0px;
		bottom: 20px;
		right: 0px;
		opacity: 0;
	}

	#info {
		padding-right: 50px;
	}
	
	#info a {
		display: none;
	}
	
	#info span {
		display: block;
		font-family: 'Promocyja', sans-serif;
		font-size: 50px;
		color: #8f2000;
		text-align: center;
	}
	
	#menu {
		text-align: center;
		position: sticky;
		margin-left: 35px;
	}
	
	#menuitems {
		top: 35px;
		height: 100%;
		width: 120px;
		z-index: 1;
		display: inline-block;
		right: 5px;
		opacity: .9;
	}

	#menuitems.hidemenuitems {
		/*display: none;*/
		right: -120px;
		opacity: 0;
	}
	
	#showmenu {
		display: inline-block;
		width: 20px;
		padding-left: 5px;
		padding-right: 5px;
		text-align: center;
	}
	
	.share {
		width: 100%;
	}
	
	#banner {
		text-shadow: none;
	}
	
	img {
		max-width: 100%;
	}
	
	input {
		text-align: center;
		width: 100%;
	}
	
	#bannertitle {
		font-size: 10vw;
	}
	
	#image span {
		margin: 0px;
	}

	fieldset {
		text-align: center;
	}
	
	fieldset .button {
		text-align: center;
	}
}