body, html {
	color: #fff;
	font-size: 12px;
	line-height: 1.5;
	font-family: OpenSans, "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif;
	height: 100%;
	margin: 0;
	padding: 0;
	background: #4e5969;
	-webkit-font-smoothing: subpixel-antialiased;
    -moz-osx-font-smoothing: grayscale;
}
	body { overflow-y: scroll; }
	body.noscroll { overflow: hidden; }

	#clean {
		background: transparent !important;
	}

* {
	-webkit-box-sizing: border-box;
 	   -moz-box-sizing: border-box;
			box-sizing: border-box;
}

pre {
	white-space: pre-wrap;
	word-wrap: break-word;
}

input, textarea {
	font-size: 1em;
	font-family: "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif;
}
input:focus, textarea:focus {
	outline: none;
}

::-moz-placeholder {
	color: rgba(255, 255, 255, 0.5);
	font-style: italic;
}
input:-moz-placeholder {
	color: rgba(255, 255, 255, 0.5);
	font-style: italic;
}
::-webkit-input-placeholder {
	color: rgba(255, 255, 255, 0.5);
	font-style: italic;
}
:-ms-input-placeholder {
	color: rgba(255, 255, 255, 0.5) !important;
	font-style: italic;
}

.tiny_scroll {
    overflow: hidden;
}

    .tiny_scroll:hover {
        overflow-y: auto;
    }

    .tiny_scroll::-webkit-scrollbar {
        width: 5px;
    }

    .tiny_scroll::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.4);
        -webkit-border-radius: 5px;
        border-radius: 5px;
    }

    .tiny_scroll::-webkit-scrollbar-thumb {
        -webkit-border-radius: 5px;
        border-radius: 5px;
        background: rgba(255,255,255,0.3);
    }

a img {
	border:none;
}

a {
	text-decoration:none;
	color: #ebfcbc;
	outline: 0;
	cursor: pointer;
	font-weight: bold;
}
a:hover { color: #f3f3f3; }

.page {
	display: none;
	width: 100%;
	max-width: 980px;
	margin: 0 auto;
	line-height: 1.5em;
	padding: 0 15px 20px;
}
	.page.active { display: block; }

.content {
	clear:both;
	padding: 65px 0 10px;
	background: #4e5969;
}

	@media all and (max-width: 480px) {
		.content {
			padding-top: 40px;
		}
	}

h2 {
	font-size: 2.5em;
	padding: 0;
	margin: 20px 0 0 0;
}

form {
	padding:0;
	margin:0;
}

body > .spinner, .mask{
	background: rgba(0,0,0, 0.9);
	z-index: 100;
	text-align: center;
}
	body > .mask {
		position: fixed;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
		padding: 200px;
	}

	@media all and (max-width: 480px) {
		body > .mask {
			padding: 20px;
		}
	}

.button {
    background: #5082bc;
    padding: 5px 10px 6px;
    color: #fff;
    text-decoration: none;
    font-weight: bold;
    line-height: 1;
    border-radius: 2px;
    cursor: pointer;
    border: none;
	-webkit-appearance: none;
}
	.button.red { background-color: #ff0000; }
	.button.green { background-color: #2aa300; }
	.button.orange { background-color: #ffa200; }
	.button.yellow { background-color: #ffe400; }

/*** Icons ***/
.icon {
	display: inline-block;
	background: center no-repeat;
}
.icon.delete { background-image: url('../images/icon.delete.png'); }
.icon.download { background-image: url('../images/icon.download.png'); }
.icon.edit { background-image: url('../images/icon.edit.png'); }
.icon.completed { background-image: url('../images/icon.check.png'); }
.icon.folder { background-image: url('../images/icon.folder.gif'); }
.icon.imdb { background-image: url('../images/icon.imdb.png'); }
.icon.refresh { background-image: url('../images/icon.refresh.png'); }
.icon.readd { background-image: url('../images/icon.readd.png'); }
.icon.rating { background-image: url('../images/icon.rating.png'); }
.icon.files { background-image: url('../images/icon.files.png'); }
.icon.info { background-image: url('../images/icon.info.png'); }
.icon.trailer { background-image: url('../images/icon.trailer.png'); }
.icon.spinner { background-image: url('../images/icon.spinner.gif'); }
.icon.attention { background-image: url('../images/icon.attention.png'); }

.icon2 {
	display: inline-block;
	background: center no-repeat;
	font-family: 'Elusive-Icons';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
	font-size: 15px;
	color: #FFF;
}

.icon2.add:before { content: "\e05a"; color: #c2fac5; }
.icon2.cog:before { content: "\e109"; }
.icon2.eye-open:before { content: "\e09d"; }
.icon2.search:before { content: "\e03e"; }
.icon2.return-key:before { content: "\e111"; }
.icon2.close:before { content: "\e04e"; }
.icon2.trailer:before { content: "\e0e9"; }
.icon2.download:before { content: "\e0c3"; }
.icon2.edit:before { content: "\e068"; }
.icon2.refresh:before { content: "\e04f"; font-weight: bold; }
.icon2.delete:before { content: "\e04e"; }
.icon2.directory:before { content: "\e097"; }
.icon2.completed:before { content: "\e070"; }
.icon2.info:before { content: "\e089"; }
.icon2.attention:before { content: "\e009"; }
.icon2.readd:before {
	display: inline-block;
	content: "\e04b";
	transform: scale(-1, 1);
}
.icon2.imdb:before {
	content: "IMDb";
	color: #444;
	padding: 2px;
	border-radius: 3px;
	background-color: #fbec98;
	font: bold 8px Arial;
	position: relative;
	top: -3px;
}
.icon2.menu:before {
	content: "\e076\00a0 \e076\00a0 \e076\00a0";
	line-height: 6px;
	transform: scaleX(2);
	width: 20px;
	font-size: 10px;
	display: inline-block;
	vertical-align: middle;
	word-wrap: break-word;
	text-align:center;
	margin-left: 5px;
}
	@media screen and (-webkit-min-device-pixel-ratio:0) {
		.icon2.menu:before {
			margin-top: -7px;
		}
	}

/*** Navigation ***/
.header {
	height: 66px;
	position: fixed;
	margin: 0;
	width: 100%;
	z-index: 5;
		background: #5c697b;
	box-shadow: 0 0 10px rgba(0,0,0,.1);
	transition: all .4s ease-in-out;
}

	@media all and (max-width: 480px) {
		.header {
			height: 44px;
		}
	}

.header > div {
	width: 100%;
	max-width: 980px;
	margin: 0 auto;
	position: relative;
	height: 100%;
	padding: 0 15px;
}

	.header .navigation {
		display: inline-block;
		vertical-align: middle;
		position: absolute;
		height: 100%;
		left: 0;
		bottom: 0;
	}

		.header .foldout {
			width: 44px;
			height: 100%;
			text-align: center;
			border-right: 1px solid rgba(255,255,255,.07);
			display: none;
			vertical-align: top;
			line-height: 42px;
			color: #FFF;
		}

		.header .logo {
			display: inline-block;
			font-size: 3em;
			padding: 4px 30px 0 15px;
			height: 100%;
            border-right: 1px solid rgba(255,255,255,.07);
			color: #FFF;
			font-weight: normal;
			vertical-align: top;
			font-family: Lobster, sans-serif;
		}

			@media all and (max-width: 480px) {
				.header .foldout {
					display: inline-block;
				}

				.header .logo {
					padding-top: 7px;
					border: 0;
					font-size: 1.7em;
				}
			}

			@media all and (min-width: 481px) and (max-width: 640px) {

				.header .logo {
					display: none;
				}

			}

		.header .navigation ul {
			display: inline-block;
			margin: 0;
			padding: 0;
			height: 100%;
		}

			.header .navigation li {
				color: #fff;
				display: inline-block;
				font-size: 1.75em;
				margin: 0;
				text-align: center;
				height: 100%;
				border: 1px solid rgba(255,255,255,.07);
				border-width: 0 0 0 1px;
			}
				.header .navigation li:first-child {
					border: none;
				}

				.header .navigation li a {
					display: block;
					padding: 15px;
					position: relative;
					height: 100%;
					border: 1px solid transparent;
					border-width: 0 0 4px 0;
					font-weight: normal;
				}

				.header .navigation li:hover a { border-color: #047792; }
				.header .navigation li.active a { border-color: #04bce6; }

				.header .navigation li.disabled { color: #e5e5e5; }
				.header .navigation li a { color: #fff; }

				.header .navigation .backtotop {
					opacity: 0;
					display: block;
					width: 80px;
					left: 50%;
					position: fixed;
					bottom: 0;
					text-align: center;
					margin: -10px 0 0 -40px;
					background: #4e5969;
					padding: 5px 0;
				    color: rgba(255,255,255,.4);
				    font-weight: normal;
				}
					.header:hover .navigation .backtotop { color: #fff; }

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

			body {
				position: absolute;
				width: 100%;
				transition: all .5s cubic-bezier(0.9,0,0.1,1);
				left: 0;
			}

			.menu_shown body {
				left: 240px;
			}

			.header .navigation {
				height: 100%;
			}

				.menu_shown .header .navigation .overlay {
					position: fixed;
					right: 0;
					top: 0;
					bottom: 0;
					left: 240px;
				}

				.header .navigation ul {
					width: 240px;
					position: fixed;
					left: -240px;
					background: rgba(0,0,0,.5);
					transition: all .5s cubic-bezier(0.9,0,0.1,1);
				}

					.menu_shown .header .navigation ul {
						left: 0;
					}

					.header .navigation ul li {
						display: block;
						text-align: left;
						border-width: 1px 0 0 0;
						height: 44px;
					}
						.header .navigation ul li a {
							border-width: 0 4px 0 0;
							padding: 5px 20px;
						}

					.header .navigation ul li.separator {
						background-color: rgba(255,255,255, .07);
						height: 5px;
					}
		}

	.header .more_menu {
		position: absolute;
		right: 15px;
		height: 100%;
		border-left: 1px solid rgba(255,255,255,.07);
	}

		@media all and (max-width: 480px) {
			.header .more_menu {
				display: none;
			}
		}

		.header .more_menu .button {
			height: 100%;
			line-height: 66px;
			text-align: center;
			padding: 0;
		}

		.header .more_menu .wrapper {
			width: 200px;
			margin-left: -106px;
			margin-top: 22px;
		}

			@media all and (max-width: 480px) {
				.header .more_menu .button {
					line-height: 44px;
				}

				.header .more_menu .wrapper {
					margin-top: 0;
				}
			}

		.header .more_menu .red { color: red; }
		.header .more_menu .orange { color: orange; }

	.badge {
		position: absolute;
		width: 20px;
		height: 20px;
		text-align: center;
		line-height: 20px;
		margin: 0;
		background-color: #1b79b8;
		top: 0;
		right: 0;
	}

	.header .notification_menu {
		right: 60px;
		display: block;
	}

		@media all and (max-width: 480px) {
			.header .notification_menu {
				right: 0;
			}
		}

	.header .notification_menu .wrapper {
		width: 300px;
		margin-left: -255px;
		text-align: left;
	}

		.header .notification_menu ul {
			min-height: 60px;
			max-height: 300px;
			overflow: auto;
		}
			.header .notification_menu ul:empty:after {
				content: 'No notifications (yet)';
				text-align: center;
				width: 100%;
				position: absolute;
				padding: 18px 0;
				font-size: 15px;
				font-style: italic;
				opacity: .4;
			}

		.header .notification_menu li > span {
			padding: 5px;
			display: block;
			border-bottom: 1px solid rgba(0,0,0,0.2);
			word-wrap: break-word;
		}
			.header .notification_menu li > span { color: #777; }
			.header .notification_menu li:last-child > span { border: 0; }
			.header .notification_menu li .added {
				display: block;
				font-size: .85em;
				color: #aaa;
			}

			.header .notification_menu li .more {
				text-align: center;
			}

	.message.update {
		text-align: center;
		position: fixed;
		padding: 10px;
		background: #ff6134;
		font-size: 15px;
		bottom: 0;
		left: 0;
		width: 100%;
		z-index: 19;
	}

		.message.update a {
			padding: 0 5px;
		}

/*** Global Styles ***/
.check {
	display: inline-block;
	vertical-align: top;
	margin-top: 4px;
	height: 16px;
	width: 16px;
	cursor: pointer;
	background: url('../images/sprite.png') no-repeat -200px;
	border-radius: 3px;
}
	.check.highlighted { background-color: #424c59; }
	.check.checked { background-position: -2px 0; }
	.check.indeterminate { background-position: -1px -119px; }
	.check input {
		display: none !important;
	}

.select {
	cursor: pointer;
	display: inline-block;
	color: #fff;
}

	.select .selection {
		display: inline-block;
		padding: 0 30px 0 20px;
		background: #5b9bd1 url('../images/sprite.png') no-repeat 94% -53px;
	}

		.select .selection .selectionDisplay {
			display: inline-block;
			padding-right: 15px;
			border-right: 1px solid rgba(0,0,0,0.2);

			box-shadow: 1px 0 0 rgba(255,255,255,0.15);
		}

	.select .menu {
		clear: both;
		overflow: hidden;
	  	font-weight: bold;
	}

	.select .list {
		display: none;
	  	background: #282d34;
		position: absolute;
		margin: 25px 0 0 0;
		box-shadow: 0 20px 20px -10px rgba(0,0,0,0.4);
		z-index: 3;
	}
		.select.active .list {
			display: block;
		}
			.select .list ul {
				display: block;
				width: 100% !important;
			}
				.select .list li {
					padding: 0 33px 0 20px;
					margin: 0 !important;
					display: block;
					border-top: 1px solid rgba(255,255,255,0.1);
					white-space: nowrap;
				}
				.select .list li.highlighted {
				  	background: rgba(255,255,255,0.1);
				  	border-color: transparent;
				}

	.select input { display: none; }

.inlay {
	color: #fff;
	border: 0;
	background-color: #282d34;
	box-shadow: inset 0 1px 8px rgba(0,0,0,0.25);
}

	.inlay.light {
		background-color: #47515f;
		outline: none;
		box-shadow: none;
	}

	.inlay:focus {
		background-color: #3a4350;
		outline: none;
	}

.onlay, .inlay .selected, .inlay:not(.reversed) > li:hover, .inlay > li.active, .inlay.reversed > li {
	border-radius:3px;
	border: 1px solid #252930;
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.20);
	background: rgb(55,62,74);
	background-image: linear-gradient(
	    0,
	    rgb(55,62,74) 0%,
	    rgb(73,83,98) 100%
	);
}
.onlay:active, .inlay.reversed > li:active {
	color: #fff;
	border: 1px solid transparent;
	background-color: #282d34;
	box-shadow: inset 0 1px 8px rgba(0,0,0,0.25);
}

.question {
	display: block;
	width: 600px;
	padding: 20px;
	position:fixed;
	z-index: 101;
	text-align: center;
}

	.question h3 {
		font-size: 25px;
		padding: 0;
		margin: 0 0 20px;
	}

	.question .hint {
		font-size: 14px;
		color: #ccc;
	}

	.question .answer {
		font-size: 17px;
		display: inline-block;
		padding: 10px;
		margin: 5px 1%;
		cursor: pointer;
		width: auto;
	}
		.question .answer:hover {
			background: #000;
		}

		.question .answer.delete {
			background-color: #a82f12;
		}
		.question .answer.cancel {
			margin-top: 20px;
			background-color: #4c5766;
		}

.more_menu {
	display: inline-block;
	vertical-align: middle;
	overflow: visible;
}

	.more_menu > a {
		display: block;
		height: 44px;
		width: 44px;
		transition: all 0.3s ease-in-out;
		border-bottom: 4px solid transparent;
		border-radius: 0;
	}

		.more_menu .button:hover {
			border-color: #047792;
		}

		.more_menu.show .button {
			border-color: #04bce6;
		}

	.more_menu .wrapper {
		display: none;
		top: 0;
		right: 0;
		margin: 11px 0 0 0;
		position: absolute;
		z-index: 90;
		width: 185px;
		box-shadow: 0 20px 20px -10px rgba(0,0,0,0.55);
		color: #444;
		background: #fff;
	}

		.more_menu.show .wrapper {
			display: block;
			top: 44px;
		}

		.more_menu ul {
			padding: 0;
			margin: 0;
			list-style: none;
		}

		.more_menu .wrapper li {
			width: 100%;
			height: auto;
		}

			.more_menu .wrapper li a {
				display: block;
				border-bottom: 1px solid rgba(255,255,255,0.2);
				box-shadow: none;
				font-weight: normal;
				font-size: 1.2em;
				letter-spacing: 1px;
				padding: 2px 10px;
				color: #444;
			}
				.more_menu .wrapper li:first-child a { padding-top: 5px; }
				.more_menu .wrapper li:last-child a { padding-bottom: 5px; }

			.more_menu .wrapper li .separator {
				border-bottom: 1px solid rgba(0,0,0,.1);
				display: block;
				height: 1px;
				margin: 5px 0;
			}

			.more_menu .wrapper li:last-child a {
				border: none;
			}
			.more_menu .wrapper li a:hover {
				background: rgba(0,0,0,0.05);
			}

.messages {
	position: fixed;
	right: 0;
	bottom: 0;
	width: 320px;
	z-index: 20;
	overflow: hidden;
	font-size: 14px;
	font-weight: bold;
}
	@media all and (max-width: 480px) {
		.messages {
			width: 100%;
		}
	}

	.messages .message {
		overflow: hidden;
		transition: all .6s cubic-bezier(0.9,0,0.1,1);
		background: #5b9bd1;
		width: 100%;
		position: relative;
		margin: 1px 0 0;
		max-height: 0;
		padding: 0 30px 0 20px;
		font-size: 1.1em;
		font-weight: normal;
		transform: scale(0);
	}
		.messages .message.sticky {
			background-color: #c84040;
		}
		.messages .message.show {
			max-height: 100px;
			padding: 15px 30px 15px 20px;
			transform: scale(1);
		}
		.messages .message.hide {
			max-height: 0;
			padding: 0 20px;
			margin: 0;
			transform: scale(0);
		}
		.messages .close {
			position: absolute;
			padding: 10px 8px;
			top: 0;
			right: 0;
			color: #FFF;
		}

/*** Login ***/
.page.login {
	display: block;
}

	.login h1 {
		padding: 0 0 10px;
		font-size: 60px;
		font-family: Lobster;
		font-weight: normal;
	}

	.login form {
		padding: 0;
		height: 300px;
		width: 400px;
		position: fixed;
		left: 50%;
		top: 50%;
		margin: -200px 0 0 -200px;
	}
		@media all and (max-width: 480px) {

			.login form {
				padding: 0;
				height: 300px;
				width: 90%;
				position: absolute;
				left: 5%;
				top: 10px;
				margin: 0;
			}

		}

	.page.login .ctrlHolder {
		padding: 0;
		margin: 0 0 20px;
	}
		.page.login .ctrlHolder:hover {
			background: none;
		}

	.page.login input[type=text],
	.page.login input[type=password] {
		width: 100% !important;
		font-size: 25px;
		padding: 14px !important;
	}

	.page.login .remember_me {
		font-size: 15px;
		float: left;
		width: 150px;
		padding: 20px 0;
	}

		.page.login .remember_me .check {
			margin: 5px 5px 0 0;
		}

	.page.login .button {
		font-size: 25px;
		padding: 20px;
		float: right;
	}

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

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

}

@font-face {
    font-family: 'OpenSans';
    src: url('../fonts/OpenSans-Italic-webfont.eot');
    src: url('../fonts/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans-Italic-webfont.woff') format('woff'),
         url('../fonts/OpenSans-Italic-webfont.ttf') format('truetype'),
         url('../fonts/OpenSans-Italic-webfont.svg#OpenSansItalic') format('svg');
    font-weight: normal;
    font-style: italic;

}

@font-face {
    font-family: 'OpenSans';
    src: url('../fonts/OpenSans-Bold-webfont.eot');
    src: url('../fonts/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans-Bold-webfont.woff') format('woff'),
         url('../fonts/OpenSans-Bold-webfont.ttf') format('truetype'),
         url('../fonts/OpenSans-Bold-webfont.svg#OpenSansBold') format('svg');
    font-weight: bold;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSans';
    src: url('../fonts/OpenSans-BoldItalic-webfont.eot');
    src: url('../fonts/OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans-BoldItalic-webfont.woff') format('woff'),
         url('../fonts/OpenSans-BoldItalic-webfont.ttf') format('truetype'),
         url('../fonts/OpenSans-BoldItalic-webfont.svg#OpenSansBoldItalic') format('svg');
    font-weight: bold;
    font-style: italic;
}

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