lychee/css/style.css

/**
 * @name        style.css
 * @author      Philipp Maurer
 * @author      Tobias Reich
 * @copyright   2013 by Philipp Maurer, Tobias Reich
 */

/* Reset -------------------------------------------------*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video { margin:0; padding:0; border:0; font-size:100%; font:inherit; vertical-align:baseline; }
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display:block; }
body { line-height:1; }
ol,ul { list-style:none; }
blockquote,q { quotes:none; }
blockquote:before,blockquote:after,q:before,q:after { content:''; content:none; }
table { border-collapse:collapse; border-spacing:0; }

/* Basics -------------------------------------------------*/
html, body {
	min-height: 100%;
	-webkit-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
}
body { background-color: #222; background-image: url(../img/background.jpg); font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 12px; -webkit-font-smoothing: antialiased; }
.center { left: 50%; top:50%; position: absolute; }
* {
	-webkit-transition: color .3s, opacity .3s ease-out, -webkit-transform .3s ease-out, box-shadow .3s;
	-moz-transition: opacity .3s ease-out, -moz-transform .3s ease-out, box-shadow .3s;
	-o-transition: opacity .3s ease-out, -o-transform .3s ease-out, box-shadow .3s;
	transition: color .3s, opacity .3s ease-out, transform .3s ease-out, box-shadow .3s;
}

/* Tooltip ------------------------------------------------*/
.tipsy {
	padding: 4px;
	font-size: 12px;
	position: absolute;
	z-index: 100000;

	/* Animation */
	-webkit-animation-name: fadeIn;
	-webkit-animation-duration: .3s;
	-webkit-animation-fill-mode: forwards;
	-moz-animation-name: fadeIn;
	-moz-animation-duration: .3s;
	-moz-animation-fill-mode: forwards;
	-o-animation-name: fadeIn;
	-o-animation-duration: .3s;
	-o-animation-fill-mode: forwards;
	animation-name: fadeIn;
	animation-duration: .3s;
	animation-fill-mode: forwards;
}
.tipsy-inner {
	padding: 7px 10px 6px 10px;
	color: white;
	max-width: 200px;
	text-align: center;
    text-shadow: 0 -1px 0 #000;
	background: #000;
	box-shadow: 0 1px 2px hsla(0, 0%, 0%, .25);
	border-radius: 3px;
}
.tipsy-arrow { position: absolute; width: 0; height: 0; line-height: 0; border: 5px dashed #000; }
.tipsy-arrow-n { border-bottom-color: #000; }
.tipsy-arrow-s { border-top-color: #000; }
.tipsy-arrow-e { border-left-color: #000; }
.tipsy-arrow-w { border-right-color: #000; }
.tipsy-n .tipsy-arrow { top: 0px; left: 50%; margin-left: -5px; border-bottom-style: solid; border-top: none; border-left-color: transparent; border-right-color: transparent; }
.tipsy-nw .tipsy-arrow { top: 0; left: 10px; border-bottom-style: solid; border-top: none; border-left-color: transparent; border-right-color: transparent;}
.tipsy-ne .tipsy-arrow { top: 0; right: 10px; border-bottom-style: solid; border-top: none;  border-left-color: transparent; border-right-color: transparent;}
.tipsy-s .tipsy-arrow { bottom: 0; left: 50%; margin-left: -5px; border-top-style: solid; border-bottom: none;  border-left-color: transparent; border-right-color: transparent; }
.tipsy-sw .tipsy-arrow { bottom: 0; left: 10px; border-top-style: solid; border-bottom: none;  border-left-color: transparent; border-right-color: transparent; }
.tipsy-se .tipsy-arrow { bottom: 0; right: 10px; border-top-style: solid; border-bottom: none; border-left-color: transparent; border-right-color: transparent; }
.tipsy-e .tipsy-arrow { right: 0; top: 50%; margin-top: -5px; border-left-style: solid; border-right: none; border-top-color: transparent; border-bottom-color: transparent; }
.tipsy-w .tipsy-arrow { left: 0; top: 50%; margin-top: -5px; border-right-style: solid; border-left: none; border-top-color: transparent; border-bottom-color: transparent; }

/* Animations ------------------------------------------------*/
.fadeIn {
	-webkit-animation-name: fadeIn;
	-webkit-animation-duration: .3s;
	-webkit-animation-fill-mode: forwards;
	-moz-animation-name: fadeIn;
	-moz-animation-duration: .3s;
	-moz-animation-fill-mode: forwards;
	-o-animation-name: fadeIn;
	-o-animation-duration: .3s;
	-o-animation-fill-mode: forwards;
	animation-name: fadeIn;
	animation-duration: .3s;
	animation-fill-mode: forwards;
}
.fadeOut {
	-webkit-animation-name: fadeOut;
	-webkit-animation-duration: .3s;
	-webkit-animation-fill-mode: forwards;
	-moz-animation-name: fadeOut;
	-moz-animation-duration: .3s;
	-moz-animation-fill-mode: forwards;
	-o-animation-name: fadeOut;
	-o-animation-duration: .3s;
	-o-animation-fill-mode: forwards;
	animation-name: fadeOut;
	animation-duration: .3s;
	animation-fill-mode: forwards;
}
.contentFadeIn {
	-webkit-animation-name: bounceInDown;
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: ease-out;
	-webkit-animation-fill-mode: forwards;
	-moz-animation-name: bounceInDown;
	-moz-animation-duration: .3s;
	-moz-animation-fill-mode: forwards;
	-o-animation-name: bounceInDown;
	-o-animation-duration: 1s;
	-o-animation-timing-function: ease-out;
	-o-animation-fill-mode: forwards;
	animation-name: bounceInDown;
	animation-duration: 1s;
	animation-timing-function: ease-out;
	animation-fill-mode: forwards;
}
.contentFadeOut {
	-webkit-animation-name: bounceOutUp;
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: ease-out;
	-webkit-animation-fill-mode: forwards;
	-moz-animation-name: bounceOutUp;
	-moz-animation-duration: .3s;
	-moz-animation-fill-mode: forwards;
	-o-animation-name: bounceOutUp;
	-o-animation-duration: 1s;
	-o-animation-timing-function: ease-out;
	-o-animation-fill-mode: forwards;
	animation-name: bounceOutUp;
	animation-duration: 1s;
	animation-timing-function: ease-out;
	animation-fill-mode: forwards;
}
.contentZoomOut {
	-webkit-animation-name: zoomOut;
	-webkit-animation-duration: .3s;
	-webkit-animation-fill-mode: forwards;
	-moz-animation-name: zoomOut;
	-moz-animation-duration: .3s;
	-moz-animation-fill-mode: forwards;
	-o-animation-name: zoomOut;
	-o-animation-duration: .3s;
	-o-animation-fill-mode: forwards;
	animation-name: zoomOut;
	animation-duration: .3s;
	animation-fill-mode: forwards;
}
.contentZoomIn {
	-webkit-animation-name: zoomIn;
	-webkit-animation-duration: .3s;
	-webkit-animation-fill-mode: forwards;
	-moz-animation-name: zoomIn;
	-moz-animation-duration: .3s;
	-moz-animation-fill-mode: forwards;
	-o-animation-name: zoomIn;
	-o-animation-duration: .3s;
	-o-animation-fill-mode: forwards;
	animation-name: zoomIn;
	animation-duration: .3s;
	animation-fill-mode: forwards;
}

/* Loading ------------------------------------------------*/
#loading {
	position: fixed;
	width: 100%;
	height: 2px;
	background-color: #2f0d0e;
	background-repeat: repeat-x;
	z-index: 1;
	display: none;

	/* Animation */
	-webkit-animation-name: moveBackground;
	-webkit-animation-duration: .2s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;
	-moz-animation-name: moveBackground;
	-moz-animation-duration: .2s;
	-moz-animation-timing-function: linear;
	-moz-animation-iteration-count: infinite;
	-o-animation-name: moveBackground;
	-o-animation-duration: .2s;
	-o-animation-timing-function: linear;
	-o-animation-iteration-count: infinite;
	animation-name: moveBackground;
	animation-duration: .2s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}
#loading h1 {
	margin: 13px;
	color: #ddd;
	font-size: 14px;
	font-weight: bold;
	text-shadow: 0px 1px 0px #000;
	text-transform: capitalize;
}
#loading h1 span {
	margin-left: 10px;
	font-weight: normal;
	text-transform: none;
}
#loading.loading {
	background-image: url(../img/bar/loading.png);
}
#loading.error {
	background-image: url(../img/bar/error.png);
}

/* Header ------------------------------------------------*/
header {
	position: fixed;
	height: 41px;
	width: 100%;

	background-color: #333;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#555), to(#333));
	background-image: -webkit-linear-gradient(top, #555, #333);
	background-image: -moz-linear-gradient(top, #555, #333);
	background-image: -o-linear-gradient(top, #555, #333);
	background-image: -ms-linear-gradient(top, #555, #333);
	background-image: linear-gradient(top, #555, #333);

	box-shadow: inset 0px 1px 0px #666, inset 0px -1px 0px #393939, 0px 0px 3px #000;
	border-top: 1px solid #222;
	z-index: 1;

	-webkit-transition: opacity .3s ease-out, -webkit-transform .3s ease-out, box-shadow .3s, margin-top .3s;
	-moz-transition: opacity .3s ease-out, -moz-transform .3s ease-out, box-shadow .3s, margin-top .3s;
	-o-transition: opacity .3s ease-out, -o-transform .3s ease-out, box-shadow .3s, margin-top .3s;
	transition: opacity .3s ease-out, transform .3s ease-out, box-shadow .3s, margin-top .3s;

	/* Animation */
	-webkit-animation-name: moveDown;
	-webkit-animation-duration: .3s;
	-webkit-animation-timing-function: ease-out;
	-webkit-animation-fill-mode: forwards;
	-moz-animation-name: moveDown;
	-moz-animation-duration: .3s;
	-moz-animation-timing-function: ease-out;
	-moz-animation-fill-mode: forwards;
	-o-animation-name: moveDown;
	-o-animation-duration: .3s;
	-o-animation-timing-function: ease-out;
	-o-animation-fill-mode: forwards;
	animation-name: moveDown;
	animation-duration: .3s;
	animation-timing-function: ease-out;
	animation-fill-mode: forwards;
}

	/* Title ------------------------------------------------*/
	#title {
		position: absolute;
		margin: 0px 30%;
		width: 40%;
		padding: 11px 0px;
		color: #fff;
		font-size: 16px;
		font-weight: bold;
		text-align: center;
		text-shadow: 0px -1px 0px #000;
	}
	#title.editable {
		cursor: pointer;
	}
	#title span {
		color: #aaa;
		font-size: 16px;
		font-weight: normal;
	}

	/* Button ------------------------------------------------*/
	header .button {
		float: left;
		position: absolute;
		padding: 7px 10px 8px 10px;
		margin: 6px 0px 0px 8px;
		font-size: 12px;
		font-weight: bold;
		color: #fff;
		text-shadow: 0px -1px 0px #000;
		text-decoration: none !important;

		background: #555;
		background-image: -webkit-gradient(linear, left bottom, left top, color-stop(1, #555), color-stop(0, #333));
		background-image: -webkit-linear-gradient(top, #555 0%, #333 100%);
		background-image: -moz-linear-gradient(top, #555 0%, #333 100%);
		background-image: -o-linear-gradient(top, #555 0%, #333 100%);
		background: linear-gradient(top, #555 0%, #333 100%);

		border: 1px solid #222;
		border-radius: 3px;
		box-shadow: inset 0 1px 0 rgba(255,255,255,0.1), 0px 1px 0px #444;
		cursor: pointer;
	}
	header .button:hover {
		background-color: #5c5c5c;
		background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(92, 92, 92)), to(rgb(57, 57, 57)));
		background-image: -webkit-linear-gradient(top, rgb(92, 92, 92), rgb(57, 57, 57));
		background-image: -moz-linear-gradient(top, rgb(92, 92, 92), rgb(57, 57, 57));
		background-image: -o-linear-gradient(top, rgb(92, 92, 92), rgb(57, 57, 57));
		background-image: -ms-linear-gradient(top, rgb(92, 92, 92), rgb(57, 57, 57));
		background-image: linear-gradient(top, rgb(92, 92, 92), rgb(57, 57, 57));
	}
	header .button:active {
		background-color: #393939;
		background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(57, 57, 57)), to(rgb(68, 68, 68)));
		background-image: -webkit-linear-gradient(top, rgb(57, 57, 57), rgb(68, 68, 68));
		background-image: -moz-linear-gradient(top, rgb(57, 57, 57), rgb(68, 68, 68));
		background-image: -o-linear-gradient(top, rgb(57, 57, 57), rgb(68, 68, 68));
		background-image: -ms-linear-gradient(top, rgb(57, 57, 57), rgb(68, 68, 68));
		background-image: linear-gradient(top, rgb(57, 57, 57), rgb(68, 68, 68));
	}
	header .button.icon {
		float: right;
		position: relative;
		padding: 7px 11px 4px 11px;
		margin: 6px 8px 0px 0px;
		font-family: 'FontAwesome';
		font-size: 16px;
	}
	#tools_albums, #tools_album, #tools_photo, #button_signin {
		display: none;
	}

	/* Button Divider ------------------------------------------------*/
	header .button_divider {
		float: right;
		position: relative;
		margin: 1px 12px 0px 0px;
		width: 1px;
		height: 40px;
		background-color: transparent;
		background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(68, 68, 68)), to(rgb(37, 37, 37)));
		background-image: -webkit-linear-gradient(top, rgba(68, 68, 68, 0), rgb(25, 25, 25));
		background-image: -moz-linear-gradient(top, rgb(68, 68, 68), rgb(37, 37, 37));
		background-image: -o-linear-gradient(top, rgb(68, 68, 68), rgb(37, 37, 37));
		background-image: -ms-linear-gradient(top, rgb(68, 68, 68), rgb(37, 37, 37));
		background-image: linear-gradient(top, rgb(68, 68, 68), rgb(37, 37, 37));
		border-right: 1px solid #555;
	}
	header .button_divider.less {
		margin: 1px 6px 0px 6px;
	}


	/* Search ------------------------------------------------*/
	#search {
		float: right;
		width: 80px;
		margin: 7px 12px 0px 0px;
		padding: 5px 10px 7px 10px;
		background-color: #444;
		color: #fff;
		border: none;
		border: 1px solid #111;
		box-shadow: 0px 1px 0px #555;
		outline: none;
		border-radius: 5px;
		opacity: .6;
		-webkit-transition: opacity .3s ease-out, -webkit-transform .3s ease-out, box-shadow .3s, width .2s ease-out;
		-moz-transition: opacity .3s ease-out, -moz-transform .3s ease-out, box-shadow .3s, width .2s ease-out;
		-o-transition: opacity .3s ease-out, -o-transform .3s ease-out, box-shadow .3s, width .2s ease-out;
		transition: opacity .3s ease-out, transform .3s ease-out, box-shadow .3s, width .2s ease-out;
	}
	#search:focus {
		box-shadow: 0px 1px 0px #555, inset 0px 0px 2px #333;
		opacity: 1;
		width: 140px;
	}

	/* Tools ------------------------------------------------*/
	.tools:first-of-type {
		margin-right: 6px;
	}
	.tools {
		float: right;
		padding: 10px 8px;
		color: #aaa;
		font-size: 21px;
		text-shadow: 0px -1px 0px #222;
		cursor: pointer;
	}
	.tools:hover a {
		color: #fff;
	}
	.tools .icon-star {
		color: #f0ef77;
	}
	.tools .icon-share.active {
		color: #ff9737;
	}


/* Content ------------------------------------------------*/
#content {
	position: absolute;
	padding: 41px 0px 33px 0px;
	width: 100%;
	-webkit-overflow-scrolling: touch;
}

	/* Photo ------------------------------------------------*/
	.photo  {
		float: left;
		display: inline-block;
		width: 206px;
		height: 206px;
		margin: 30px 0px 0px 30px;
		cursor: pointer;
	}
	.photo img {
		position: absolute;
		width: 200px;
		height: 200px;
		background-color: #222;
		border-radius: 3px;
		box-shadow: 0px 1px 5px #111;
		border: 3px solid #ccc;
	}
	.photo:hover img, .photo.active img {
		box-shadow: 0px 0px 10px #005ecc;
	}

	/* Album ------------------------------------------------*/
	.album  {
		float: left;
		display: inline-block;
		width: 206px;
		height: 206px;
		margin: 30px 0px 0px 30px;
		cursor: pointer;
	}
	.album img:first-child, .album img:nth-child(2) {
		-webkit-transform: rotate(0deg) translateY(0px) translateX(0px);
		-moz-transform: rotate(0deg) translateY(0px) translateX(0px);
		-o-transform: rotate(0deg) translateY(0px) translateX(0px);
		transform: rotate(0deg) translateY(0px) translateX(0px);
		opacity: 0;
	}
	.album:hover img:first-child {
		-webkit-transform: rotate(-2deg) translateY(10px) translateX(-12px);
		-moz-transform: rotate(-2deg) translateY(10px) translateX(-12px);
		-o-transform: rotate(-2deg) translateY(10px) translateX(-12px);
		transform: rotate(-2deg) translateY(10px) translateX(-12px);
		opacity: 1;
	}
	.album:hover img:nth-child(2) {
		-webkit-transform: rotate(5deg) translateY(-8px) translateX(12px);
		-moz-transform: rotate(5deg) translateY(-8px) translateX(12px);
		-o-transform: rotate(5deg) translateY(-8px) translateX(12px);
		transform: rotate(5deg) translateY(-8px) translateX(12px);
		opacity: 1;
	}
	.album img {
		position: absolute;
		width: 200px;
		height: 200px;
		background-color: #222;
		border-radius: 3px;
		box-shadow: 0px 1px 5px #111;
		border: 3px solid #ccc;
	}
	.album:hover img, .album.active img {
		box-shadow: 0px 0px 10px #005ecc;
	}

	/* Album/Photo Overlay ------------------------------------------------*/
	.album .overlay, .photo .overlay {
		position: absolute;
		width: 200px;
		height: 200px;
		margin: 3px;
		background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 20%, rgba(0,0,0,0.9) 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(20%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.9))); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 20%,rgba(0,0,0,0.9) 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 20%,rgba(0,0,0,0.9) 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 20%,rgba(0,0,0,0.9) 100%); /* IE10+ */
		background: linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 20%,rgba(0,0,0,0.9) 100%); /* W3C */
	}
	.photo .overlay {
		opacity: 0;
	}
	.photo:hover .overlay, .photo.active .overlay {
		opacity: 1;
	}
	.album .overlay h1, .photo .overlay h1 {
		min-height: 19px;
		width: 190px;
		margin: 153px 0px 3px 15px;
		color: #fff;
		font-size: 16px;
		font-weight: bold;
		text-shadow: 0px 1px 0px #000;
		overflow: hidden;
	}
	.album .overlay a {
		margin-left: 15px;
		font-size: 11px;
		color: #aaa;
		text-shadow: 0px 1px 0px #000;
	}
	.photo .overlay a {
		margin: 155px 0px 5px 15px;
		font-size: 11px;
		color: #aaa;
		text-shadow: 0px 1px 0px #000;
	}

	/* Badges ------------------------------------------------*/
	.album .badge, .photo .badge {
		position: absolute;
		margin-top: -1px;
		margin-left: 12px;
		padding: 12px 7px 3px 7px;
		box-shadow: 0px 0px 3px #000;
		border-radius: 0px 0px 3px 3px;
		border: 1px solid #fff;
		border-top: none;
		color: #fff;
		font-size: 24px;
		text-shadow: 0px 1px 0px #000;
		opacity: .9;
	}
	.album .badge.icon-star, .photo .badge.icon-star {
		padding: 12px 8px 3px 8px;
	}
	.album .badge.icon-share, .photo .badge.icon-share {
		padding: 12px 6px 3px 8px;
	}
	.album .badge::after, .photo .badge::after {
		content: "";
		position: absolute;
		margin-top: -12px;
		margin-left: -26px;
		width: 34px;
		height: 5px;
		background: -moz-linear-gradient(top, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,1)), color-stop(100%,rgba(0,0,0,0))); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top, rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top, rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(top, rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%); /* IE10+ */
		background: linear-gradient(top, rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%); /* W3C */
		opacity: .4;
	}
	.album .badge.icon-star::after {
		margin-left: -28px;
		width: 36px;
	}
	.album .badge.icon-share::after, .photo .badge.icon-share::after {
		margin-left: -30px;
		width: 38px;
	}
	.album .badge.icon-reorder::after {
		margin-left: -30px;
		width: 38px;
	}
	.album .badge:nth-child(2n), .photo .badge:nth-child(2n) {
		margin-left: 57px;
	}
	.album .badge.red, .photo .badge.red {
		background: #d64b4b;
		background: -webkit-gradient(linear, left top, left bottom, from(#d64b4b), to(#ab2c2c));
		background: -webkit-linear-gradient(top, #d64b4b, #ab2c2c);
		background: -moz-linear-gradient(top, #d64b4b, #ab2c2c);
		background: -ms-linear-gradient(top, #d64b4b, #ab2c2c);
		background: -o-linear-gradient(top, #d64b4b, #ab2c2c);
	}
	.album .badge.blue, .photo .badge.blue {
		background: #d64b4b;
		background: -webkit-gradient(linear, left top, left bottom, from(#347cd6), to(#2945ab));
		background: -webkit-linear-gradient(top, #347cd6, #2945ab);
		background: -moz-linear-gradient(top, #347cd6, #2945ab);
		background: -ms-linear-gradient(top, #347cd6, #2945ab);
		background: -o-linear-gradient(top, #347cd6, #2945ab);
	}

	/* Divider ------------------------------------------------*/
	.divider {
		float: left;
		width: 100%;
		height: 32px;
		margin-top: 50px;
		opacity: 0;

		background-color: #2b2b2b;
		background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(43, 43, 43)), to(rgb(35, 35, 35)));
		background-image: -webkit-linear-gradient(top, rgb(43, 43, 43), rgb(35, 35, 35));
		background-image: -moz-linear-gradient(top, rgb(43, 43, 43), rgb(35, 35, 35));
		background-image: -o-linear-gradient(top, rgb(43, 43, 43), rgb(35, 35, 35));
		background-image: -ms-linear-gradient(top, rgb(43, 43, 43), rgb(35, 35, 35));
		background-image: linear-gradient(top, rgb(43, 43, 43), rgb(35, 35, 35));

		box-shadow: 0px 1px 0px #111, inset 0px 1px 0px rgba(255, 255, 255, .1);
	}
	.divider:first-child {
		margin-top: 2px;
	}
	.divider h1 {
		float: left;
		margin: 8px 0px 0px 30px;
		color: #fff;
		font-size: 14px;
		font-weight: bold;
		text-shadow: 0px -1px 0px #000;
	}

	/* No Content ------------------------------------------------*/
	.no_content {
		position: absolute;
		top: 50%;
		left: 50%;
		height: 160px;
		width: 180px;
		margin-top: -80px;
		margin-left: -90px;
		padding-top: 20px;
		color: rgba(20, 20, 20, 1);
		text-shadow: 0px 1px 0px rgba(255, 255, 255, .05);
		text-align: center;
	}

	.no_content .icon {
		font-size: 120px;
	}

	.no_content p {
		font-size: 18px;
	}

/* Overlay ------------------------------------------------*/
.message_overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	background-color: rgba(0,0,0,.3);
	background-image: -webkit-gradient(radial, 50% 50%,0,50% 50%,200, from(rgba(0, 0, 0, 0.85)), to(rgba(0, 0, 0, 0.50)));
	background-image: -webkit-radial-gradient(50% 50%, rgba(0, 0, 0, 0.50), rgba(0, 0, 0, 0.85));
	background-image: -moz-radial-gradient(50% 50%, rgba(0, 0, 0, 0.50), rgba(0, 0, 0, 0.85));
	background-image: -o-radial-gradient(50% 50%, rgba(0, 0, 0, 0.50), rgba(0, 0, 0, 0.85));
	background-image: -ms-radial-gradient(50% 50%, rgba(0, 0, 0, 0.50), rgba(0, 0, 0, 0.85));
	background-image: radial-gradient(50% 50%, rgba(0, 0, 0, 0.50), rgba(0, 0, 0, 0.85));
	z-index: 1000;
}

	.message {
		position: absolute;
		display: inline-block;
		width: 500px;
		margin-left: -250px;
		margin-top: -85px;
		background-color: #505050;
		background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(80, 80, 80)), to(rgb(43, 42, 42)));
		background-image: -webkit-linear-gradient(top, rgb(80, 80, 80), rgb(43, 42, 42));
		background-image: -moz-linear-gradient(top, rgb(80, 80, 80), rgb(43, 42, 42));
		background-image: -o-linear-gradient(top, rgb(80, 80, 80), rgb(43, 42, 42));
		background-image: -ms-linear-gradient(top, rgb(80, 80, 80), rgb(43, 42, 42));
		background-image: linear-gradient(top, rgb(80, 80, 80), rgb(43, 42, 42));
		border-radius: 5px;
		border-bottom: 1px solid #000;
		box-shadow: 0px 0px 5px #000, inset 0px 1px 0px rgba(255,255,255,.2), inset 1px 0px 0px rgba(255,255,255,.05), inset -1px 0px 0px rgba(255,255,255,.05);

		/* Animation */
		-webkit-animation-name: bounceInDown;
		-webkit-animation-duration: 1s;
		-webkit-animation-timing-function: ease-out;
		-webkit-animation-fill-mode: forwards;
		-moz-animation-name: bounceInDown;
		-moz-animation-duration: 1s;
		-moz-animation-timing-function: ease-out;
		-moz-animation-fill-mode: forwards;
		-o-animation-name: bounceInDown;
		-o-animation-duration: 1s;
		-o-animation-timing-function: ease-out;
		-o-animation-fill-mode: forwards;
		animation-name: bounceInDown;
		animation-duration: 1s;
		animation-timing-function: ease-out;
		animation-fill-mode: forwards;
	}
	.message h1 {
		float: left;
		width: 100%;
		padding: 12px 0px;
		color: #fff;
		font-size: 16px;
		font-weight: bold;
		text-shadow: 0px -1px 0px #000;
		text-align: center;
	}
	.message .close {
		position: absolute;
		top: 0px;
		right: 0px;
		padding: 12px 14px 6px 7px;
		color: #aaa;
		font-size: 20px;
		text-shadow: 0px -1px 0px #111;
		cursor: pointer;
	}
	.message .close:hover {
		color: #fff;
	}
	.message p {
		float: left;
		width: 90%;
		margin-top: 1px;
		padding: 12px 5% 15px 5%;
		color: #eee;
		font-size: 14px;
		text-shadow: 0px -1px 0px #222;
		line-height: 20px;
	}
	.message p b {
		font-weight: bold;
	}
	.message .button {
		float: right;
		margin: 15px 15px 15px 0px;
		padding: 6px 10px 8px 10px;
		background-color: #4e4e4e;
		background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(78, 78, 78)), to(rgb(45, 45, 45)));
		background-image: -webkit-linear-gradient(top, rgb(78, 78, 78), rgb(45, 45, 45));
		background-image: -moz-linear-gradient(top, rgb(78, 78, 78), rgb(45, 45, 45));
		background-image: -o-linear-gradient(top, rgb(78, 78, 78), rgb(45, 45, 45));
		background-image: -ms-linear-gradient(top, rgb(78, 78, 78), rgb(45, 45, 45));
		background-image: linear-gradient(top, rgb(78, 78, 78), rgb(45, 45, 45));

		color: #ccc;
		font-size: 14px;
		font-weight: bold;
		text-align: center;
		text-shadow: 0px -1px 0px #000;
		border-radius: 5px;
		border: 1px solid #111;
		box-shadow: inset 0px 1px 0px rgba(255,255,255,.2), 0px 1px 0px rgba(255,255,255,.1);
		cursor: pointer;
	}
	.message .button:first-of-type {
		margin: 15px 5% 18px 0px !important;
	}
	.message .button.active {
		color: #fff;
		box-shadow: inset 0px 1px 0px rgba(255,255,255,.2), 0px 1px 0px rgba(255,255,255,.1), 0px 0px 5px #005ecc;
	}
	.message .button:hover {
		background-color: #565757;
		background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(86, 87, 87)), to(rgb(57, 57, 57)));
		background-image: -webkit-linear-gradient(top, rgb(86, 87, 87), rgb(57, 57, 57));
		background-image: -moz-linear-gradient(top, rgb(86, 87, 87), rgb(57, 57, 57));
		background-image: -o-linear-gradient(top, rgb(86, 87, 87), rgb(57, 57, 57));
		background-image: -ms-linear-gradient(top, rgb(86, 87, 87), rgb(57, 57, 57));
		background-image: linear-gradient(top, rgb(86, 87, 87), rgb(57, 57, 57));
	}
	.message .button:active, .message .button.pressed {
		background-color: #393939;
		background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(57, 57, 57)), to(rgb(75, 76, 76)));
		background-image: -webkit-linear-gradient(top, rgb(57, 57, 57), rgb(75, 76, 76));
		background-image: -moz-linear-gradient(top, rgb(57, 57, 57), rgb(75, 76, 76));
		background-image: -o-linear-gradient(top, rgb(57, 57, 57), rgb(75, 76, 76));
		background-image: -ms-linear-gradient(top, rgb(57, 57, 57), rgb(75, 76, 76));
		background-image: linear-gradient(top, rgb(57, 57, 57), rgb(75, 76, 76));
	}

	/* Add Album ------------------------------------------------*/
	.message.add {
		width: 588px;
		margin-top: -152px;
		margin-left: -294px;
	}
	.add_album {
		float: left;
		display: inline-block;
		width: 150px;
		height: 200px;
		margin: 30px 0px 30px 30px;
		border-radius: 3px;
		border: 3px dashed #777;
		cursor: pointer;
		text-align: center;
		-webkit-transition: border .3s;
		-moz-transition: border .3s;
		-o-transition: border .3s;
		transition: border .3s;
	}
	.add_album:hover {
		border: 3px dashed #fff;
	}
	.add_album .icon {
		margin-top: 55px;
		color: #777;
		font-family: 'FontAwesome';
		font-size: 80px;
		text-shadow: 0px 1px 2px #000;
	}
	.add_album:hover .icon {
		color: #fff;
	}
	.add_album a {
		float: left;
		width: 100%;
		color: #777;
		font-size: 14px;
		font-weight: bold;
		text-shadow: 0px 1px 0px #000;
	}
	.add_album:hover a {
		color: #fff;
	}

	/* Sign in ------------------------------------------------*/
	.sign_in {
		float: left;
		width: 100%;
		margin-top: 1px;
		padding: 5px 0px;
		color: #eee;
		font-size: 14px;
		text-shadow: 0px -1px 0px #222;
		line-height: 20px;
	}
	.sign_in input {
		float: left;
		width: 86%;
		padding: 7px 2% 9px 2%;
		margin: 0px 5%;
		background-color: #444;
		color: #fff;
		text-shadow: 0px 1px 0px #222;
		border: none;
		border: 1px solid #111;
		box-shadow: 0px 1px 0px #555;
		outline: none;
		border-radius: 5px;
	}
	.sign_in input:first-of-type {
		margin-bottom: 10px;
	}
	.sign_in input:focus {
		box-shadow: 0px 1px 0px #666, inset 0px 0px 3px #333, 0px 0px 5px #005ecc;
	}
	.sign_in input.error:focus {
		box-shadow: 0px 1px 0px #666, inset 0px 0px 3px #333, 0px 0px 5px #cc0007;
	}
	.message #version {
		display: inline-block;
		margin-top: 23px;
		margin-left: 5%;
		color: #888;
		text-shadow: 0px -1px 0px #111;
	}
	.message #version span {
		display: none;
	}
	.message #version span a {
		color: #888;
	}

	/* Copy Link, Password ------------------------------------------------*/
	.message .copylink, .message .password {
		float: left;
		width: 95%;
		padding: 7px 10px 9px 10px;
		margin-top: 20px;
		background-color: #444;
		color: #fff;
		text-shadow: 0px 1px 0px #222;
		border: none;
		border: 1px solid #111;
		box-shadow: 0px 1px 0px #666, inset 0px 0px 3px #333, 0px 0px 5px #005ecc;
		outline: none;
		border-radius: 5px;
	}
	.message .copylink {
		margin-bottom: 20px;
	}

/* Image View ------------------------------------------------*/
#imageview {
	position: fixed;
	display: none;
	width: 100%;
	min-height: 100%;
	background-color: rgba(30,30,30,.99);
	box-shadow: 0px 2px 4px #000;
	-webkit-transition: background-color .3s;
}
#imageview.full {
	background-color: #111;
}

#imageview #image {
	position: absolute;
	top: 70px;
	right: 30px;
	bottom: 30px;
	left: 30px;
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: contain;
	-webkit-transition: top .3s, bottom .3s, margin-top .3s;

	-webkit-animation-name: zoomIn;
	-webkit-animation-duration: .3s;
	-webkit-animation-fill-mode: forwards;
	-moz-animation-name: zoomIn;
	-moz-animation-duration: .3s;
	-moz-animation-fill-mode: forwards;
	-o-animation-name: zoomIn;
	-o-animation-duration: .3s;
	-o-animation-fill-mode: forwards;
	animation-name: zoomIn;
	animation-duration: .3s;
	animation-fill-mode: forwards;
}
#imageview #image.small {
	top: 50%;
	right: auto;
	bottom: auto;
	left: 50%;
}

	/* Previous/Next Buttons ------------------------------------------------*/
	#imageview a {
		position: fixed;
		top:  50%;
		margin-top: -10px;
		color: #fff;
		font-size: 50px;
		text-shadow: 0px 1px 2px #000;
		cursor: pointer;
		opacity: .1;
		z-index: 1;
	}
	#imageview a:hover {
		opacity: .9;
	}
	#imageview a#previous {
		left: 20px;
		-webkit-transition: left .3s;
	}
	#imageview.full a#previous {
		left: -50px;
	}
	#imageview a#next {
		right: 20px;
		-webkit-transition: right .3s
	}
	#imageview.full a#next {
		right: -50px;
	}

	/* InfoBox ------------------------------------------------*/
	#infobox_overlay {
		z-index: 2;
		position: fixed;
		width: 100%;
		height: 100%;
		top: 0px;
		left: 0px;
		background-color: rgba(0,0,0,.7);
		-webkit-animation-name: fadeIn;
		-webkit-animation-duration: .5s;
		-webkit-animation-fill-mode: forwards;
		-moz-animation-name: fadeIn;
		-moz-animation-duration: .5s;
		-moz-animation-fill-mode: forwards;
		-o-animation-name: fadeIn;
		-o-animation-duration: .5s;
		-o-animation-fill-mode: forwards;
		animation-name: fadeIn;
		animation-duration: .5s;
		animation-fill-mode: forwards;
	}
	#infobox {
		z-index: 3;
		position: fixed;
		right: -320px;
		width: 300px;
		height: 100%;
		background-color: rgba(20,20,20,0.98);
		box-shadow: -1px 0px 2px #000;
		display: none;

		-webkit-user-select: text;
		-moz-user-select: text;
		-o-user-select: text;
		user-select: text;

		-webkit-transition: right .5s ease-out;
		-moz-transition: right .5s;
		-o-transition: right .5s;
		transition: right .5s;
	}
	#infobox .wrapper {
		float: left;
		height: 100%;
		overflow: scroll;
	}
	#infobox .header {
		float: left;
		height: 41px;
		width: 100%;

		background-color: #1d1d1d;
		background-image: -webkit-gradient(linear, left top, left bottom, from(#1d1d1d), to(#050505));
		background-image: -webkit-linear-gradient(top, #1d1d1d, #050505);
		background-image: -moz-linear-gradient(top, #1d1d1d, #050505);
		background-image: -o-linear-gradient(top, #1d1d1d, #050505);
		background-image: -ms-linear-gradient(top, #1d1d1d, #050505);
		background-image: linear-gradient(top, #1d1d1d, #050505);

		box-shadow: inset 0px 1px 0px #111, inset 0px -1px 0px #000;
		border-top: 1px solid #000;
	}
	#infobox .header h1 {
		position: absolute;
		margin: 0px 30%;
		width: 40%;
		margin-top: 11px;
		color: #fff;
		font-size: 16px;
		font-weight: bold;
		text-align: center;
		text-shadow: 0px -1px 0px #000;
	}
	#infobox .header a {
		float: right;
		padding: 10px 15px;
		color: #fff;
		font-size: 21px;
		font-weight: bold;
		text-shadow: 0px -1px 0px #000;
		opacity: .5;
		cursor: pointer;
	}
	#infobox .header a:hover {
		opacity: 1;
	}
	#infobox .separater {
		float: left;
		width: 100%;
		height: 27px;

		background-color: #2b2b2b;
		background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(43, 43, 43)), to(rgb(35, 35, 35)));
		background-image: -webkit-linear-gradient(top, rgb(43, 43, 43), rgb(35, 35, 35));
		background-image: -moz-linear-gradient(top, rgb(43, 43, 43), rgb(35, 35, 35));
		background-image: -o-linear-gradient(top, rgb(43, 43, 43), rgb(35, 35, 35));
		background-image: -ms-linear-gradient(top, rgb(43, 43, 43), rgb(35, 35, 35));
		background-image: linear-gradient(top, rgb(43, 43, 43), rgb(35, 35, 35));

		box-shadow: 0px 1px 0px #000, inset 0px 1px 0px rgba(255, 255, 255, .1);
	}
	#infobox .separater h1 {
		margin: 5px 0px 0px 15px;
		color: #fff;
		font-size: 14px;
		font-weight: bold;
		text-shadow: 0px -1px 0px #000;
	}
	#infobox table {
		float: left;
		margin: 10px 0px 15px 15px;
	}
	#infobox table tr td {
		padding: 5px 0px;
		color: #fff;
		font-size: 14px;
		line-height: 19px;
	}
	#infobox table tr td:first-child {
		width: 110px;
	}
	#infobox table tr td:last-child {
		padding-right: 10px;
	}
	#infobox .bumper {
		float: left;
		width: 100%;
		height: 35px;
	}
	#infobox #edit_title,
	#infobox #edit_description {
		display: inline;
		margin-left: 3px;
		width: 20px;
		height: 5px;
		cursor: pointer;
	}

/* ContextMenu ------------------------------------------------*/
.contextmenu_bg {
	position: fixed;
	height: 100%;
	width: 100%;
	z-index: 1000;
}
.contextmenu {
	position: fixed;
	top: 110%;
	left: 110%;
	padding: 5px 0px;
	background-color: #393939;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#393939), to(#2d2d2d));
	background-image: -webkit-linear-gradient(top, #444, #2d2d2d);
	background-image: -moz-linear-gradient(top, #393939, #2d2d2d);
	background-image: -o-linear-gradient(top, #393939, #2d2d2d);
	background-image: -ms-linear-gradient(top, #393939, #2d2d2d);
	background-image: linear-gradient(top, #393939, #2d2d2d);
	border: 1px solid rgba(0,0,0,0.7);
	border-bottom: 1px solid rgba(0,0,0,.9);
	border-radius: 5px;
	box-shadow: 0px 3px 5px rgba(0,0,0,0.4), inset 0px 1px 0px rgba(255,255,255,0.2), inset 1px 0px 0px rgba(255,255,255,0.05), inset -1px 0px 0px rgba(255,255,255,0.05);
	opacity: .98;
	z-index: 1001;
}

	/* Items ------------------------------------------------*/
	.contextmenu tr {
		font-size: 14px;
		color: #eee;
		text-shadow: 0px -1px 0px rgba(0,0,0,.7);
		cursor: pointer;
	}
	.contextmenu tr:hover {
		background-color: #6a84f2;
		background-image: -webkit-gradient(linear, left top, left bottom, from(#6a84f2), to(#3959ef));
		background-image: -webkit-linear-gradient(top, #6a84f2, #3959ef);
		background-image: -moz-linear-gradient(top, #6a84f2, #3959ef);
		background-image: -o-linear-gradient(top, #6a84f2, #3959ef);
		background-image: -ms-linear-gradient(top, #6a84f2, #3959ef);
		background-image: linear-gradient(top, #6a84f2, #3959ef);
	}
	.contextmenu tr.no_hover:hover {
		cursor: inherit;
		background-color: inherit;
		background-image: none;
	}
	.contextmenu tr.separator {
		float: left;
		height: 1px;
		width: 100%;
		background-color: #222;
		box-shadow: 0px 1px 0px #555;
		margin: 4px 0px 5px 0px;
		cursor: inherit;
	}
	.contextmenu tr.separator:hover {
		background-color: #222;
		background-image: none;
	}
	.contextmenu tr td {
		padding: 5px 20px 5px 10px;
		-webkit-transition: none;
		-moz-transition: none;
		-o-transition: none;
		transition: none;
	}
	.contextmenu tr:hover td {
		color: #fff;
		box-shadow: inset 0px 1px 0px rgba(255,255,255,.1);
		text-shadow: 0px -1px 0px rgba(0,0,0,.7);
	}
	.contextmenu tr.no_hover:hover td {
		box-shadow: none;
	}
	.contextmenu tr a {
		float: left;
		width: 10px;
		margin-right: 10px;
		text-align: center;
	}

	/* Direct Link Input ------------------------------------------------*/
	.contextmenu #link {
		float: right;
		width: 140px;
		margin: 0px -10px -1px 0px;
		padding: 4px 6px 5px 6px;
		background-color: #444;
		color: #fff;
		border: none;
		border: 1px solid #111;
		box-shadow: 0px 1px 0px rgba(255,255,255,.1);
		outline: none;
		border-radius: 5px;
	}
	.contextmenu tr a#link_icon {
		padding-top: 4px;
	}

/* Upload ------------------------------------------------*/
#upload {
	display: none;
}
.upload_overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,.3);
	background-image: -webkit-gradient(radial, 50% 50%,0,50% 50%,200, from(rgba(0, 0, 0, 0.85)), to(rgba(0, 0, 0, 0.50)));
	background-image: -webkit-radial-gradient(50% 50%, rgba(0, 0, 0, 0.50), rgba(0, 0, 0, 0.85));
	background-image: -moz-radial-gradient(50% 50%, rgba(0, 0, 0, 0.50), rgba(0, 0, 0, 0.85));
	background-image: -o-radial-gradient(50% 50%, rgba(0, 0, 0, 0.50), rgba(0, 0, 0, 0.85));
	background-image: -ms-radial-gradient(50% 50%, rgba(0, 0, 0, 0.50), rgba(0, 0, 0, 0.85));
	background-image: radial-gradient(50% 50%, rgba(0, 0, 0, 0.50), rgba(0, 0, 0, 0.85));
	z-index: 1000;
}
.upload_message {
	position: absolute;
	display: inline-block;
	width: 200px;
	margin-left: -100px;
	margin-top: -85px;
	background-color: #505050;
	background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(80, 80, 80)), to(rgb(43, 42, 42)));
	background-image: -webkit-linear-gradient(top, rgb(80, 80, 80), rgb(43, 42, 42));
	background-image: -moz-linear-gradient(top, rgb(80, 80, 80), rgb(43, 42, 42));
	background-image: -o-linear-gradient(top, rgb(80, 80, 80), rgb(43, 42, 42));
	background-image: -ms-linear-gradient(top, rgb(80, 80, 80), rgb(43, 42, 42));
	background-image: linear-gradient(top, rgb(80, 80, 80), rgb(43, 42, 42));
	border-radius: 5px;
	border-bottom: 1px solid #000;
	box-shadow: 0px 0px 5px #000, inset 0px 1px 0px rgba(255,255,255,.2), inset 1px 0px 0px rgba(255,255,255,.05), inset -1px 0px 0px rgba(255,255,255,.05);

	/* Animation */
	-webkit-animation-name: bounceInDown;
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: ease-out;
	-webkit-animation-fill-mode: forwards;
	-moz-animation-name: bounceInDown;
	-moz-animation-duration: 1s;
	-moz-animation-timing-function: ease-out;
	-moz-animation-fill-mode: forwards;
	-o-animation-name: bounceInDown;
	-o-animation-duration: 1s;
	-o-animation-timing-function: ease-out;
	-o-animation-fill-mode: forwards;
	animation-name: bounceInDown;
	animation-duration: 1s;
	animation-timing-function: ease-out;
	animation-fill-mode: forwards;
}
.upload_message a {
	float: left;
	margin: 35px 69px 5px 69px;
	color: #fff;
	font-size: 80px;
	text-shadow: 0px 1px 2px #000;
	z-index: 2;

	/* Animation */
	-webkit-animation-name: pulse;
	-webkit-animation-duration: 2s;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: infinite;
	-moz-animation-name: pulse;
	-moz-animation-duration: 2s;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-iteration-count: infinite;
	-o-animation-name: pulse;
	-o-animation-duration: 2s;
	-o-animation-timing-function: ease-in-out;
	-o-animation-iteration-count: infinite;
	animation-name: pulse;
	animation-duration: 2s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
}
.upload_message p {
	float: left;
	width: 200px;
	margin: 10px 0px;
	color: #fff;
	font-size: 14px;
	text-align: center;
	text-shadow: 0px -1px 0px #000;
}
.upload_message .progressbar {
	float: left;
	width: 170px;
	height: 25px;
	margin: 15px;
	background-image: url(data:image/png;base64,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bj4KICAgICAgICAgPGV4aWY6Q29sb3JTcGFjZT4xPC9leGlmOkNvbG9yU3BhY2U+CiAgICAgICAgIDxleGlmOlBpeGVsWURpbWVuc2lvbj4yNTwvZXhpZjpQaXhlbFlEaW1lbnNpb24+CiAgICAgIDwvcmRmOkRlc2NyaXB0aW9uPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iPgogICAgICAgICA8ZGM6c3ViamVjdD4KICAgICAgICAgICAgPHJkZjpCYWcvPgogICAgICAgICA8L2RjOnN1YmplY3Q+CiAgICAgIDwvcmRmOkRlc2NyaXB0aW9uPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iPgogICAgICAgICA8eG1wOk1vZGlmeURhdGU+MjAxMi0wOS0yOFQxNDowOTozMDwveG1wOk1vZGlmeURhdGU+CiAgICAgICAgIDx4bXA6Q3JlYXRvclRvb2w+UGl4ZWxtYXRvciAyLjEuMTwveG1wOkNyZWF0b3JUb29sPgogICAgICA8L3JkZjpEZXNjcmlwdGlvbj4KICAgPC9yZGY6UkRGPgo8L3g6eG1wbWV0YT4KhsXwcAAAABJQTFRFAAAA////////////////////PlKtOgAAAAZ0Uk5TAAECAwQF749peAAAAF1JREFUGNNjYIAA11AICIDyGZigAqEGMBFWmAhMgMEUKhAEFwlFN4YZJqIAExGFCoTgNoYRpskBJsICExHAbQzMC4EYxhjgNkYVKhCM2xhiQgLTGCJCgpWckMAwBgAeZ0aFTqsxyQAAAABJRU5ErkJggg==), #101010;
	background-image: url(data:image/png;base64,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bj4KICAgICAgICAgPGV4aWY6Q29sb3JTcGFjZT4xPC9leGlmOkNvbG9yU3BhY2U+CiAgICAgICAgIDxleGlmOlBpeGVsWURpbWVuc2lvbj4yNTwvZXhpZjpQaXhlbFlEaW1lbnNpb24+CiAgICAgIDwvcmRmOkRlc2NyaXB0aW9uPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iPgogICAgICAgICA8ZGM6c3ViamVjdD4KICAgICAgICAgICAgPHJkZjpCYWcvPgogICAgICAgICA8L2RjOnN1YmplY3Q+CiAgICAgIDwvcmRmOkRlc2NyaXB0aW9uPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iPgogICAgICAgICA8eG1wOk1vZGlmeURhdGU+MjAxMi0wOS0yOFQxNDowOTozMDwveG1wOk1vZGlmeURhdGU+CiAgICAgICAgIDx4bXA6Q3JlYXRvclRvb2w+UGl4ZWxtYXRvciAyLjEuMTwveG1wOkNyZWF0b3JUb29sPgogICAgICA8L3JkZjpEZXNjcmlwdGlvbj4KICAgPC9yZGY6UkRGPgo8L3g6eG1wbWV0YT4KhsXwcAAAABJQTFRFAAAA////////////////////PlKtOgAAAAZ0Uk5TAAECAwQF749peAAAAF1JREFUGNNjYIAA11AICIDyGZigAqEGMBFWmAhMgMEUKhAEFwlFN4YZJqIAExGFCoTgNoYRpskBJsICExHAbQzMC4EYxhjgNkYVKhCM2xhiQgLTGCJCgpWckMAwBgAeZ0aFTqsxyQAAAABJRU5ErkJggg==), -webkit-linear-gradient(top, #101010, #1f1f1f);
	background-image: url(data:image/png;base64,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bj4KICAgICAgICAgPGV4aWY6Q29sb3JTcGFjZT4xPC9leGlmOkNvbG9yU3BhY2U+CiAgICAgICAgIDxleGlmOlBpeGVsWURpbWVuc2lvbj4yNTwvZXhpZjpQaXhlbFlEaW1lbnNpb24+CiAgICAgIDwvcmRmOkRlc2NyaXB0aW9uPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iPgogICAgICAgICA8ZGM6c3ViamVjdD4KICAgICAgICAgICAgPHJkZjpCYWcvPgogICAgICAgICA8L2RjOnN1YmplY3Q+CiAgICAgIDwvcmRmOkRlc2NyaXB0aW9uPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iPgogICAgICAgICA8eG1wOk1vZGlmeURhdGU+MjAxMi0wOS0yOFQxNDowOTozMDwveG1wOk1vZGlmeURhdGU+CiAgICAgICAgIDx4bXA6Q3JlYXRvclRvb2w+UGl4ZWxtYXRvciAyLjEuMTwveG1wOkNyZWF0b3JUb29sPgogICAgICA8L3JkZjpEZXNjcmlwdGlvbj4KICAgPC9yZGY6UkRGPgo8L3g6eG1wbWV0YT4KhsXwcAAAABJQTFRFAAAA////////////////////PlKtOgAAAAZ0Uk5TAAECAwQF749peAAAAF1JREFUGNNjYIAA11AICIDyGZigAqEGMBFWmAhMgMEUKhAEFwlFN4YZJqIAExGFCoTgNoYRpskBJsICExHAbQzMC4EYxhjgNkYVKhCM2xhiQgLTGCJCgpWckMAwBgAeZ0aFTqsxyQAAAABJRU5ErkJggg==), -moz-linear-gradient(top, #101010, #1f1f1f);
	background-image: url(data:image/png;base64,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bj4KICAgICAgICAgPGV4aWY6Q29sb3JTcGFjZT4xPC9leGlmOkNvbG9yU3BhY2U+CiAgICAgICAgIDxleGlmOlBpeGVsWURpbWVuc2lvbj4yNTwvZXhpZjpQaXhlbFlEaW1lbnNpb24+CiAgICAgIDwvcmRmOkRlc2NyaXB0aW9uPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iPgogICAgICAgICA8ZGM6c3ViamVjdD4KICAgICAgICAgICAgPHJkZjpCYWcvPgogICAgICAgICA8L2RjOnN1YmplY3Q+CiAgICAgIDwvcmRmOkRlc2NyaXB0aW9uPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iPgogICAgICAgICA8eG1wOk1vZGlmeURhdGU+MjAxMi0wOS0yOFQxNDowOTozMDwveG1wOk1vZGlmeURhdGU+CiAgICAgICAgIDx4bXA6Q3JlYXRvclRvb2w+UGl4ZWxtYXRvciAyLjEuMTwveG1wOkNyZWF0b3JUb29sPgogICAgICA8L3JkZjpEZXNjcmlwdGlvbj4KICAgPC9yZGY6UkRGPgo8L3g6eG1wbWV0YT4KhsXwcAAAABJQTFRFAAAA////////////////////PlKtOgAAAAZ0Uk5TAAECAwQF749peAAAAF1JREFUGNNjYIAA11AICIDyGZigAqEGMBFWmAhMgMEUKhAEFwlFN4YZJqIAExGFCoTgNoYRpskBJsICExHAbQzMC4EYxhjgNkYVKhCM2xhiQgLTGCJCgpWckMAwBgAeZ0aFTqsxyQAAAABJRU5ErkJggg==), -o-linear-gradient(top, #101010, #1f1f1f);
	background-image: url(data:image/png;base64,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bj4KICAgICAgICAgPGV4aWY6Q29sb3JTcGFjZT4xPC9leGlmOkNvbG9yU3BhY2U+CiAgICAgICAgIDxleGlmOlBpeGVsWURpbWVuc2lvbj4yNTwvZXhpZjpQaXhlbFlEaW1lbnNpb24+CiAgICAgIDwvcmRmOkRlc2NyaXB0aW9uPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iPgogICAgICAgICA8ZGM6c3ViamVjdD4KICAgICAgICAgICAgPHJkZjpCYWcvPgogICAgICAgICA8L2RjOnN1YmplY3Q+CiAgICAgIDwvcmRmOkRlc2NyaXB0aW9uPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iPgogICAgICAgICA8eG1wOk1vZGlmeURhdGU+MjAxMi0wOS0yOFQxNDowOTozMDwveG1wOk1vZGlmeURhdGU+CiAgICAgICAgIDx4bXA6Q3JlYXRvclRvb2w+UGl4ZWxtYXRvciAyLjEuMTwveG1wOkNyZWF0b3JUb29sPgogICAgICA8L3JkZjpEZXNjcmlwdGlvbj4KICAgPC9yZGY6UkRGPgo8L3g6eG1wbWV0YT4KhsXwcAAAABJQTFRFAAAA////////////////////PlKtOgAAAAZ0Uk5TAAECAwQF749peAAAAF1JREFUGNNjYIAA11AICIDyGZigAqEGMBFWmAhMgMEUKhAEFwlFN4YZJqIAExGFCoTgNoYRpskBJsICExHAbQzMC4EYxhjgNkYVKhCM2xhiQgLTGCJCgpWckMAwBgAeZ0aFTqsxyQAAAABJRU5ErkJggg==), -ms-linear-gradient(top, #101010, #1f1f1f);
	background-image: url(data:image/png;base64,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bj4KICAgICAgICAgPGV4aWY6Q29sb3JTcGFjZT4xPC9leGlmOkNvbG9yU3BhY2U+CiAgICAgICAgIDxleGlmOlBpeGVsWURpbWVuc2lvbj4yNTwvZXhpZjpQaXhlbFlEaW1lbnNpb24+CiAgICAgIDwvcmRmOkRlc2NyaXB0aW9uPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iPgogICAgICAgICA8ZGM6c3ViamVjdD4KICAgICAgICAgICAgPHJkZjpCYWcvPgogICAgICAgICA8L2RjOnN1YmplY3Q+CiAgICAgIDwvcmRmOkRlc2NyaXB0aW9uPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iPgogICAgICAgICA8eG1wOk1vZGlmeURhdGU+MjAxMi0wOS0yOFQxNDowOTozMDwveG1wOk1vZGlmeURhdGU+CiAgICAgICAgIDx4bXA6Q3JlYXRvclRvb2w+UGl4ZWxtYXRvciAyLjEuMTwveG1wOkNyZWF0b3JUb29sPgogICAgICA8L3JkZjpEZXNjcmlwdGlvbj4KICAgPC9yZGY6UkRGPgo8L3g6eG1wbWV0YT4KhsXwcAAAABJQTFRFAAAA////////////////////PlKtOgAAAAZ0Uk5TAAECAwQF749peAAAAF1JREFUGNNjYIAA11AICIDyGZigAqEGMBFWmAhMgMEUKhAEFwlFN4YZJqIAExGFCoTgNoYRpskBJsICExHAbQzMC4EYxhjgNkYVKhCM2xhiQgLTGCJCgpWckMAwBgAeZ0aFTqsxyQAAAABJRU5ErkJggg==), linear-gradient(top, #101010, #1f1f1f);
	border: 1px solid #000;
	box-shadow: 0 1px 0 rgba(255,255,255,.2), inset 0px 0px 2px #111;
	border-radius: 5px;

	/* Animation */
	-webkit-animation-name: moveBackground;
	-webkit-animation-duration: .6s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;
	-moz-animation-name: moveBackground;
	-moz-animation-duration: .6s;
	-moz-animation-timing-function: linear;
	-moz-animation-iteration-count: infinite;
	-o-animation-name: moveBackground;
	-o-animation-duration: .6s;
	-o-animation-timing-function: linear;
	-o-animation-iteration-count: infinite;
	animation-name: moveBackground;
	animation-duration: .6s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}
.upload_message .progressbar div {
	float: left;
	width: 0%;
	height: 100%;
	box-shadow: 0 1px 0 #000, 1px 0px 2px #000;
	background-color: #f5f2f7;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f2f7), to(#c7c6c8));
	background-image: -webkit-linear-gradient(top, #f5f2f7, #c7c6c8);
	background-image: -moz-linear-gradient(top, #f5f2f7, #c7c6c8);
	background-image: -o-linear-gradient(top, #f5f2f7, #c7c6c8);
	background-image: -ms-linear-gradient(top, #f5f2f7, #c7c6c8);
	background-image: linear-gradient(top, #f5f2f7, #c7c6c8);
	border-radius: 5px;
	-webkit-transition: width .2s, opacity .5;
	-moz-transition: width .2s, opacity .5;
	-o-transition: width .2s, opacity .5;
	transition: width .2s, opacity .5;
}

/* Screen behavior -------------------------------------------------*/
@media only screen and (max-width: 900px) {

	#title { margin: 0px 20%; width: 40%; }
	#title.view { margin: 11px 20% 0px 20%; width: 60%;	}
	#title span { display: none; }

}
@media only screen and (max-width: 640px) {

	#title { display: none; }
	#title.view { display: block; margin: 11px 20% 0px 15%; width: 65%;	}
	#button_move { display: none; }
	#button_archive { display: none; }

	.center { top: 0px; left: 0px; }

	.album { margin: 40px 0px 0px 50px; }
	.photo { margin: 40px 0px 0px 50px; }

	.message {
		position: fixed;
		width: 100%;
		height: 100%;
		margin: 1px 0px 0px 0px !important;
		border-radius: 0px;

		/* Animation */
		-webkit-animation-name: moveUp;
		-webkit-animation-duration: .3s;
		-moz-animation-name: moveUp;
		-moz-animation-duration: .3s;
		-o-animation-name: moveUp;
		-o-animation-duration: .3s;
		animation-name: moveUp;
		animation-duration: .3s;
	}

	.message.add {
		width: 100%;
		margin-top: 0px;
	}

	.add_album {
		width: 88%;
		height: 100px;
		margin: 30px 5% -10px 5%;
	}

	.add_album .icon {
		margin-top: 18px;
		font-size: 50px;
	}

}