@font-face {
	font-family:'Michroma';
	font-weight:normal;
	font-style:normal;
	src:url('../fonts/Michroma.woff') format('woff'),
		url('../fonts/Michroma.ttf') format('truetype');
}

@font-face {
    font-family:'Symbols';
    font-weight:normal;
    font-style:normal;
    src:url('../fonts/symbols.woff') format('woff'),
         url('../fonts/symbols.ttf') format('truetype');
}

* {padding:0; margin:0; outline:none;}
a {color:#900; text-decoration:none;}
a:hover {color:#900; text-decoration:underline;}
a:focus {outline:none;}
a img {border:0;}
.HIDE {display:none;}
.clear {clear:both; font-size:0;}

body {background:#626262;color:#d0d0d0; font-size:12px; font-family:Verdana, Arial, Helvetica, sans-serif; line-height:16px; padding:35px 15px 30px 20px; -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-user-select:none;}
body.std {overflow-y:scroll}
body.iOS.v7.webapp {padding-top:55px;}
body.iOS.v7.webapp .statusbar {background:#626262; opacity:0.8; position:fixed; top:0; left:0; width:100%; height:20px; display:block; z-index:1200;}
.statusbar {display:none;}
#info {margin-top:10px; color:#9b9b9b; font-size:10px; position:absolute; right:15px; bottom:-22px; text-shadow:1px 1px 1px #222}
.cont {box-shadow:0px 0px 7px rgba(0, 0, 0, 0.8); border:1px solid #333; background:#444444; max-width:1450px; position:relative; border-radius:18px 3px; margin-left:130px;}
#clip {position:relative; overflow:hidden; padding:20px 0; opacity:0; display:none;}
#tabs {position:absolute; top:-35px; right:0; height:30px; overflow:hidden; padding:5px 15px 0 15px;}
#tabs .tab {float:left; background:#5b5b5b; color:#bbb; border-radius:10px 3px 0 0; line-height:25px; padding:0 15px; box-shadow:0 0 4px rgba(0, 0, 0, 0.8); font-family:'Michroma', arial, serif; font-size:12px; position:relative; z-index:1; overflow:hidden; margin:0 -3px; cursor:pointer; margin-top:5px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.std #tabs .tab {transition:margin 0.15s ease-out, padding-top 0.15s ease-out, padding-bottom 0.15s ease-out;}
#tabs.slim .tab {font-size:11px; padding:0 13px;}
#tabs .tab .shadow {height:5px; line-height:0; position:absolute; bottom:-5px; left:-5px; width:130%; box-shadow:0 0 3px rgba(0,0,0,0.9);}
#tabs .tab.active .shadow, .std #tabs .tab:hover .shadow {display:none;}
.std #tabs .tab:hover {z-index:2; background:#444444; color:#f2f2f2;
	background:linear-gradient(#5b5b5b 45%, #444444 100%);
	background:-webkit-linear-gradient(#5b5b5b 45%, #444444 100%);
} 
#tabs .tab.active,
.std #tabs .tab.active:hover {z-index:3; color:#fff; text-shadow:0 0 3px rgba(255, 255, 255, 0.7); margin-top:1px; padding-top:2px !important; padding-bottom:2px ; box-shadow:0 0 6px rgba(0, 0, 0, 0.8);
	background:#444444;
	background:linear-gradient(#5b5b5b 0%, #444444 70%);
	background:-webkit-linear-gradient(#5b5b5b 0%, #444444 70%);
}

h1 {font-size:40px; font-weight:bold; line-height:40px; margin:0 0 30px 20px; text-shadow:-1px -1px 0px #101010, 1px 1px 0px #505050; color:#333; font-family:'Michroma', arial, serif;}
h1 .count {font-size:29px; font-weight:normal;}
h1#fHead {position:relative; z-index:1; padding-right:180px;}

table {border-collapse:separate; border-spacing:0; empty-cells:show;}
#content {position:relative; border-bottom:1px solid #555; width:100%;}
#content th, 
#content td {vertical-align:top; text-align:left; cursor:default;}
#content th {padding:4px 6px; font-size:11px; font-family:'Michroma'; font-weight:normal; cursor:default; color:#d9d9d9; border-right:1px solid #666; border-bottom:1px solid #666; background:#4b4b4b;}
#content td {font-size:11px; font-weight:normal; border-bottom:1px solid #333; border-top:1px solid #555; padding:6px 6px;}
#content th:last-child {border-right:0;}
#content thead > tr:first-child:after {content:''; display:block; background:#4b4b4b; width:12px; height:24px; position:absolute; border-left:1px solid #666; top:0; right:0;}
#content th.sort:last-child {}
.std #content tbody tr:hover {background:#373737;}
.std #content tbody tr:hover td {border-top:1px solid #343434; border-bottom:1px solid #393939;}
#content th.min {width:1px}
#content th.genre {width:120px}
#content th.genre:hover,
#content th.genre.active,
#content th.genre.on {border-bottom:#4B4B4B; background-color:#373737;}
#content td.genre a {cursor:pointer; color:inherit;}
#content td.genre a:hover {color:#fff; text-shadow:0 0 2px rgba(255, 255, 255, 0.5); text-decoration:none;}
#content td.genre .hl_g {color:#C9BF87;}
#content td.cover  {text-align:center; padding-left:8px;}
#content td.cover img {box-shadow:0px 1px 3px #111; width:40px; cursor:pointer;}
#content td.fsk,
#content td.jahr,
#content td.bewert,
#content td.dauer {padding-right:20px; text-align:right; white-space:nowrap;}
#content td.bewert .sterne {font-size:11px;}
#content td.hd {text-align:right; padding-right:20px;}
#content td.more {cursor:help;}
#content td.staff {white-space:pre-line;}
#content .oTitle,
#content .bewertF,
#content .dauerF {display:block; color:#808080; clear:both;}
#content th .actor {color:#808080; font-size:10px; display:none;}
#content .actF {color:#808080; margin-top:6px;}
#content tt {display:none;}
.std #content td:hover tt {display:inline; font-weight:normal; color:#c3c3c3; position:absolute; margin:1px 0 0 6px; font-family:'Symbols'; cursor:help; transform:scaleX(-1);}
#content span.sortTitle,
#content span.darsteller,
#content span.studio,
#content span.autor,
#content span.actors,
#content span.inhalt,
#content div.tech {display:none;}
#toggleIncExc {float:right; width:23px; height:15px; background:url(../img/ico-inc-exc.png) 0 0 no-repeat; background-size:100%; margin-top:2px; display:none; cursor:pointer;}
#toggleIncExc.inc {background-position:0 -15px;}
#content th.genre.on #toggleIncExc, #content th.genre:hover #toggleIncExc {display:block;}

.reso {font-size:10px; color:#777; display:block;}
.reso:before {display:block; text-align:center; font-size:9px; line-height:14px; padding:0 2px 1px 2px; white-space:nowrap; border-radius:5px 0; box-shadow:0px 0px 2px #151515; font-weight:bold; text-shadow:none; content:'SD'; color:#ddd;
	background:#707470;
	background:linear-gradient(#707470 0%, #484848 100%);
	background:-webkit-linear-gradient(#707470 0%, #484848 100%);
}

.reso.r720:before {content:'HD'; box-shadow:0px 0px 3px #111; color:#151515;
	background:#e3e3e4;
	background:linear-gradient( #e3e3e4 0%, #bbc 100%);
	background:-webkit-linear-gradient( #e3e3e4 0%, #bbc 100%);
}
.reso.r1080:before {content:'HD'; box-shadow:0px 0px 3px #111; color:#000;
	background:#f0f0dc;
	background:linear-gradient(#f0f0dc 0%, #bbb490 100%);
	background:-webkit-linear-gradient(#f0f0dc 0%, #bbb490 100%);
}

/* Sortierbare Tabellen */
#content.sortable th.sort {cursor:pointer; padding-right:19px;}
#content.sortable th.sort:last-child {padding-right:32px;}
.std #content.sortable th.sort:hover {background:#373737 bottom right no-repeat; color:#f8f8f8;}
.std #content.sortable th.sort:hover:after {content:'}'; font-family:'Symbols'; text-shadow:none;font-size:18px; color:#666; float:right; margin:1px -14px -1px 0;}
	 #content.sortable th.sort.genre:hover {border-bottom:1px solid #373737;}
	 #content.sortable thead th.sort.asc  {background:#444; text-shadow:0 0 2px rgba(255, 255, 255, 0.5); color:#FFF;}
	 #content.sortable thead th.sort.asc:after {content:'}'; font-family:'Symbols'; text-shadow:none;font-size:18px; color:#D0D0D0 !important; float:right; margin:1px -14px -1px 0;}
.std #content.sortable thead th.sort.asc:hover {background:#373737;}
	 #content.sortable thead th.sort.desc {background:#444; text-shadow:0 0 2px rgba(255, 255, 255, 0.5); color:#FFF;}
	 #content.sortable thead th.sort.desc:after {content:'{' !important; font-family:'Symbols'; text-shadow:none;font-size:18px; color:#D0D0D0 !important; float:right; margin:1px -14px -1px 0;}
.std #content.sortable thead th.sort.desc:hover {background:#373737;}
#content.sortable thead td.space {line-height:0; padding:0; border-top:1px solid #333; height:15px;}
#content.sortable .hl_1 td:nth-child(2),
#content.sortable .hl_2 td:nth-child(3),
#content.sortable .hl_3 td:nth-child(4),
#content.sortable .hl_4 td:nth-child(5),
#content.sortable .hl_5 td:nth-child(6),
#content.sortable .hl_6 td:nth-child(7),
#content.sortable .hl_7 td:nth-child(8),
#content.sortable .hl_8 td:nth-child(9),
#content.sortable .hl_9 td:nth-child(10) {color:#fff; text-shadow:0px 1px 1px #202020;}

#coverHolder {position:absolute; top:0; left:0; width:1px;}
#coverTT {position:absolute; right:-155px; top:0; z-index:100; padding:5px; background:#fcfcfc; box-shadow:0 1px 7px rgba(0,0,0,0.75); border-radius:4px; border:1px solid #333; opacity:0; transition:opacity 0.3s linear; -webkit-transition:opacity 0.3s linear;}
#coverTT.animate {-webkit-transition:top 0.3s cubic-bezier(.09, .11, .08, 1.01), opacity 0.15s linear; transition:top 0.3s cubic-bezier(.09, .11, .08, 1.01), opacity 0.15s linear;}
#coverTT img {display:block;}
#infoTT {display:none; position:absolute; left:0; top:0; z-index:101; padding:5px 8px; background:#f2f2f2; box-shadow:0 1px 6px rgba(0,0,0,0.75); border-radius:3px; border:1px solid #222; border-top-color:#fff; border-left-color:#fcfcfc; color:#222; font-size:11px; line-height:14px; max-width:380px; text-shadow:1px 1px 0 #f0f0f0;
	background:linear-gradient(#f2f2f2 0%, #ccc 100%);
	background:-webkit-linear-gradient(#f2f2f2 0%, #ccc 100%);
}
#infoTT h1 {font-size:12px; text-shadow:none; margin:0 0 2px 0; padding:0; color:#111; line-height:14px;}
#infoTT p {margin-bottom:8px;}
#infoTT p.pre {white-space:pre-line;}
#infoTT p.no {white-space:nowrap;}
#infoTT p i {width:86px; display:inline-block; font-style:normal;}
#infoTT .actors th {text-align:left; padding-right:15px; font-weight:normal; font-variant:small-caps; max-width:180px;}
#infoTT .actors td {white-space:nowrap;}

#emptyTable {border-bottom:1px solid #333; text-align:center; padding:15px 6px; font-size:11px; display:none;}
.filterText {position:absolute; top:35px; right:0; z-index:5; width:180px;}
#filterText {background:#393939; height:25px; width:100%; padding:0 55px 0 5px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; border:0; border-radius:4px 0 0 4px; color:#aaa;box-shadow:inset 1px 0px 2px rgba(0,0,0,0.5); font:11px/23px Verdana, Geneva, sans-serif; border-top:1px solid#222; border-bottom:1px solid #555;}
#filterTextIcon {position:absolute; top:2px; right:7px; font-family:'Symbols'; font-size:12px; position:absolute; color:#b5b5b5; border-left:1px solid #666; padding:2px 0 0 7px; height:19px; width:13px;}
#filterTextClear {position:absolute; top:4px; right:32px; z-index:6; font-size:16px; color:#b5b5b5; line-height:16px; width:18px; height:18px; text-align:center; font-weight:bold; border-radius:2px; cursor:pointer; display:none;}
#filterTextClear:hover {box-shadow:0 0 3px rgba(0, 0, 0, 0.5); background:#555; color:#fff;}
span.HL {color:#222; border-radius:3px; padding:1px 3px; margin:-2px; box-shadow:1px 1px 4px rgba(0,0,0,0.5); border:1px solid rgba(100, 100, 100, 0.5); text-shadow:none;
	background:linear-gradient(#FFF916 0%, #F4D000 100%);
	background:-webkit-linear-gradient(#FFF916 0%, #F4D000 100%);
}
#details {max-width:800px; padding:12px 15px 5px 15px; background:#f2f2f2; border-radius:4px; border:1px solid #333; border-top-color:#fff; border-left-color:#fcfcfc; color:#222; font-size:12px; position:relative;
	text-shadow:1px 1px 0 #f0f0f0;
	background:linear-gradient(#f2f2f2 0%, #ccc 100%);
	background:-webkit-linear-gradient(#f2f2f2 0%, #ccc 100%);
}
#details h1 {font-size:16px; line-height:20px; text-shadow:inherit; margin:0 0 4px -1px; padding:0; font-family:'Michroma'; color:inherit; font-weight:normal;}
#details h2 {font-size:12px; line-height:16px; color:#333; font-weight:normal; padding-bottom:7px;}
#details .head {position:relative; border-bottom:1px solid #999; margin-bottom:10px;}
#details .head .jahr {position:absolute; right:0; bottom:7px; color:#333; font-size:11px;}
#details .content {position:relative;}
#details .cInner {min-height:485px;}
#details .cover {float:left; margin:3px 15px 15px 0; min-width:120px;}
#details .cover img {box-shadow:0px 0px 2px rgba(0,0,0,0.7);}
#details table.i1 {float:left; border:0; margin:0 20px 10px 0;}
#details table.i1 th {text-align:left; font-weight:bold; padding-right:15px; width:1px;}
#details table.i1 th, td {padding-bottom:3px; vertical-align:top;}
#details table.i1 td {max-width:220px; min-width:100px;}
#details .dauerF {color:#777;padding-left:8px;}
#details .dauerF:before {content:"("}
#details .dauerF:after {content:")"}
#details .bewert {display:none;}
#details .sterne {color:#aaa;float:left; width:63px; margin:-1px 5px 0 0;}
#details .sterne .value{color:#333; text-shadow:none;}
#details .i2 {float:left; margin:0 45px 10px 0;}
#details .i2 i {width:110px; display:inline-block; padding-bottom:2px; font-weight:bold; font-style:normal;}
#details .i3 {position:absolute; top:0; right:0; width:30px;}
#details .i3 .tech,
#details .i2 h1 {display:none;}
#details .inhalt {white-space:pre-line; margin-bottom:10px;}
#details div.line {margin-bottom:10px; border-top:1px solid #aaa; border-bottom:1px solid #eee; line-height:0; clear:both;}
#details div.line.dark {border-top:1px solid #a0a0a0; border-bottom:1px solid #e6e6e6; line-height:0; clear:both;}
#details table.actors {margin-bottom:10px;}
#details table.actors th {text-align:left; padding-right:15px; font-weight:bold; font-variant:small-caps; vertical-align:top;}
#details table.actors td {padding:0; white-space:nowrap;}
#details table.col td.pad {padding-right:40px;}
#details .backdrops {padding:0 0 5px 0;}
#details .backdrops img {float:left; margin:0 5px 5px 0; cursor:pointer; width:75px; height:42px;}
#details .backdrops img:last-child {margin-right:0;}
#details .backdrops img.active {border:2px solid #900; border-radius:2px; box-shadow:0 0 3px #000; margin:-2px 3px 3px -2px;}
#details .backdrop {position:absolute; left:0; bottom:10px; z-index:100; width:100%; text-align:center; opacity:0;}
#details .backdrop img {margin:auto; display:block; max-width:100%;}
#details td.fsk:after {content:" Jahre";} 
#details span.fsk {background:url(../img/fsk.png) 0 0 no-repeat; display:none; height:30px; width:30px; margin:0 0 5px 0;}
#details .fsk.rate_0  {display:block;}
#details .fsk.rate_6  {display:block; background-position:0 -30px;}
#details .fsk.rate_12 {display:block; background-position:0 -60px;}
#details .fsk.rate_16 {display:block; background-position:0 -90px;}
#details .fsk.rate_18 {display:block; background-position:0 -120px;}

#genreFilter {position:absolute; width:100%; height:0; left:0; top:25px; background-color:inherit; border-bottom:1px solid #666; display:none; overflow:hidden !important; z-index:10;}
#genreFilter .filters {width:100%; border-spacing:0; border-collapse:collapse;}
#genreFilter td {padding:10px 10px 10px 0; border:0 !important;}
#genreFilter td:first-child {padding-left:1%;}
#genreFilter .btn {font-weight:normal; color:#D9D9D9; float:left; clear:both; text-shadow:none; cursor:pointer; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; height:18px;}
#genreFilter .btn span {color:#808080; padding-left:5px; font-size:9px; text-shadow:none;}
#genreFilter .btn:hover {text-decoration:none; color:#fff; text-shadow:0 0 2px rgba(255, 255, 255, 0.5);}
#genreFilter .btn.active {color:#FC0;}
#genreFilter .btn.disabled {color:#484848; cursor:default;}
#genreFilter .btn.disabled span {display:none;}
#genreFilter .btn.disabled:hover {text-shadow:none;}

.sterne {color:#2b2b2b; width:59px; height:16px; position:relative; float:right; font-family:'Symbols'; text-align:left; overflow:hidden; white-space:nowrap;}
.sterne .value{height:100%; color:#C0BA97; position:absolute; top:0; left:0; overflow:hidden; white-space:nowrap; z-index:2; text-shadow:0px 1px 1px #202020;}

.clickTextFilter:hover {color:#900; cursor:pointer;}
.clickTextFilter:hover:after {content:'L'; font-family:'Symbols'; font-size:10px; position:absolute; margin:0 0 0 5px;}

.swipe-active {overflow:hidden;position:relative;}
.swipe-active > div {display:block;visibility:hidden;position:absolute;bottom:0;left:0;}

.fade {-webkit-transition:opacity 0.3s linear; transition:opacity 0.3s linear;}
.fade.hide {-webkit-transform:translateY(-30000px); transform:translateY(-30000px); bottom:auto;}

#fancybox-overlay {position:fixed; top:0; left:0; width:100%; height:100% !important; z-index:1100; display:none; }
#fancybox-tmp {padding:0; margin:0; border:0; overflow:auto; display:none;}
#fancybox-wrap {position:absolute; top:0; left:0; padding:20px; z-index:1101; display:none;}
#fancybox-outer {position:relative; width:100%; height:100%; background:transparent;}
#fancybox-content {width:0; height:0; padding:0; position:relative; overflow:hidden; z-index:1102; box-shadow:0 0 14px rgba(0,0,0,0.85); border-radius:4px; background:#fff;}
#fancybox-hide-sel-frame {position:absolute; top:0; left:0; width:100%; height:100%; background:transparent; z-index:1101;}
#fancybox-error {color:#444; font:normal 12px/20px Arial; padding:14px; margin:0;}
#fancybox-img {width:100%; height:100%; padding:0; margin:0; border:none; line-height:0; vertical-align:top;}
#fancybox-left,
#fancybox-right {display:none;}
.fancybox-bg {position:absolute; padding:0; margin:0; border:0; width:20px; height:20px; z-index:1001;}
#fancybox-bg-n,#fancybox-bg-ne,#fancybox-bg-e,#fancybox-bg-se,#fancybox-bg-s,#fancybox-bg-sw,#fancybox-bg-w,#fancybox-bg-nw {display:none;}
#fancybox-title {font-family:Helvetica; font-size:12px; z-index:1102; font-weight:bold;}
.fancybox-title-inside {padding-top:6px; text-align:left; color:#333; position:relative;}
#fancybox-close { position:absolute; top:-13px; right:-11px; width:19px; height:19px; font-size:15px; line-height:18px; text-align:center; font-weight:bold; cursor:pointer; z-index:1103; display:none; border-radius:50%; border:2px solid #fff; color:#fff; background:#000; box-shadow:-2px 2px 3px rgba(0,0,0,0.5); }
#fancybox-close:before {content:'×'; }
.iOS #fancybox-close {width:19px; padding-left:1px; height:20px; line-height:17px;}
#fancybox-loading  {display:none !important; }

body.mobile .cont {margin-left:0;}

@media (max-width: 1100px) {
#coverHolder {display:none;}
body {padding-left:10px; padding-right:10px;}
.cont {margin-left:0;}
}
@media (max-width: 900px) {
body {padding-left:5px; padding-right:5px;}
#content > tbody td:nth-child(10),
#content > thead th:nth-child(10) {display:none;}
#content thead > tr:first-child:after {width:5px;}
#details table.i1 td {max-width:200px;}
}
@media (max-width: 800px) {
#content td {font-size:10px; line-height:14px;}
#content > tbody td:nth-child(4),
#content > thead th:nth-child(4),
#details .i3 {display:none;}
h1#fHead {font-size:22px; line-height:22px; margin:-5px 15px 50px 20px; padding:0;}
h1 .count {font-size:18px;}	
.filterText {top:50px; width:240px;}
#details {font-size:11px; line-height:14px;}
#details table.i1 {margin-right:15px;}
#details table.i1 td {max-width:140px; padding-bottom:2px;}
#details table.i1 th {padding-right:5px; padding-bottom:2px;}
#details .i2 {margin-right:0;}
#details .i2 i {width:100px;}
#details .cInner {min-height:430px;}
#details table.col td.pad {padding-right:20px;}
}
@media (max-width: 700px) {
#content > tbody td:nth-child(7),
#content > thead th:nth-child(7),
#details .i2 {display:none;}
#details table.i1 td {max-width:240px;}
#details .cInner {min-height:0;}
#details table.col td.pad {padding-right:15px;}
}
@media (max-width: 600px) {
#content > tbody td:nth-child(5),
#content > thead th:nth-child(5) {display:none;}
#content td {font-size:9px; line-height:12px;}
#details {padding:8px 10px 0px 10px;}
#details .backdrops img {width:56px; height:31px;}
}
@media (max-width: 510px) {
#content > tbody td:nth-child(9),
#content > thead th:nth-child(9) {display:none;}
#details .cover {min-width:0;}
#details .cover img {max-width:80px;}
}
@media (max-width: 510px), (max-height:400px) {
body {padding-top:30px;}
#tabs {height:25px; top:-30px; padding-right:10px;}
#tabs .tab, #tabs.slim .tab {font-size:9px; padding:0 10px; line-height:20px;}
#tabs .tab.active, .std #tabs .tab.active:hover {padding-bottom:3px; margin-top:0;}
h1#fHead {font-size:18px; line-height:18px; margin:-10px 15px 40px 15px;}
h1 .count {font-size:14px; line-height:17px;}
body {padding-left:3px; padding-right:3px;}
.filterText {width:95%; top:35px;}
#details h1 {font-size:15px;}
#details h2 {font-size:10px; line-height:12px; }
#details div.line {margin-bottom:5px;}
#details table.actors,
#details .inhalt,
#details table.i1 {margin-bottom:5px;}
}
@media (max-width: 475px) {
#details .cover {display:none;}
#content > tbody td:nth-child(3),
#content > thead th:nth-child(3) {display:none;}
}
@media (max-width: 380px), (max-height:400px) {
#details h1 {font-size:12px; line-height:14px;}
#details {font-size:9px; line-height:11px;}
#details .sterne {line-height:14px; width:50px;}
#details table.i1 td,
#details table.i1 th {padding-bottom:1px;}
#details .backdrops img {width:38px; height:21px;}
#content td .oTitle {display:none;}
#content td.cover img {width:30px;}
}
