Results of the CSS crunched for yasminjqb8s4.soup.io

Let's see what we've done for yasminjqb8s4.soup.io

CSSCruncher.com has crunched this CSS to
14.75 %Less Size! Nice!

Crunched CSS code:

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,600,400italic);/* FUNCTIONALITY + UI STYLES */
/* Included on all pages of Soup */
/* enforced even with custom CSS */
.hidden{display:none}
iframe.hidden{display:block;border:0;width:0;height:0;visibility:hidden;position:absolute}
a img{border:0}
.admin-edit input{font-family:inherit;font-size:inherit;font-weight:inherit;font-style:inherit}
.sparkline{display:none}
#remote-iframe-container{position:absolute;top:0;left:0}
#repost-iframe,#repost-to-iframe{visibility:hidden;z-index:60;position:absolute;width:1;height:1}
.actionbar,body.repost-iframe #repost-container{font-size:11px !important;line-height:15px !important;font-family:Arial,sans-serif}
body.repost-iframe #repost-container{float:left}
body.repost-iframe,body.repost-to-iframe{margin:0}
.flag-summary{margin-bottom:120px}
.actionbar{position:absolute;z-index:50;right:1em;margin:0 0 0 0;margin-top:6px;padding:0 2px;background:url(/images/black50.png);-moz-border-radius:1em;-webkit-border-radius:1em;visibility:hidden;border:1px solid #fff;border-radius:1em}
#actionbar_arrow_up{display:none;position:absolute;margin-left:-11px;margin-top:3px;z-index:59}
.actionbar li{list-style-type:none;float:left;margin:2px 0}
body.repost-iframe a,.actionbar li a{display:block;float:left;text-align:center;-moz-border-radius:.8em;-webkit-border-radius:.8em;color:#fff !important;padding:2px 6px 2px 6px;font-weight:bold;text-transform:uppercase;text-decoration:none;letter-spacing:-.02em}
.actionbar li a.hidden{display:none}
.actionbar li.permalink a{opacity:.5;filter:alpha(opacity=50)}
.post .actionbar li a:hover, body.repost-iframe a:hover{background:#fff;color:#666 !important}
body.permalink .actionbar li.permalink{display:none}
.actionbar li.first a{padding-left:.8em}
.actionbar li.last a{padding-right:.8em}
.actionbar .flag a{font-size:0px;width:10px;height:15px;background-image:url("/images/icon_flag_white.png");background-size:12px 12px;background-repeat:no-repeat;background-position:3px 4px}
.post .actionbar li.flag a:hover{background-image:url("/images/icon_flag_gray.png");background-size:12px 12px;background-repeat:no-repeat;background-position:3px 4px;-moz-border-radius:6px;-webkit-border-radius:6px;border-radius:6px}
body.user-flag-menu-iframe{margin:0px}
#user-flag-menu{margin:0px;background:rgba(0,0,0,0.8);padding:6px;border-radius:4px;position:relative;color:white;list-style:none}
#user-flag-menu li{padding-top:4px;padding-bottom:4px}
#user-flag-menu .flg-btn{border:0px solid #f4f4f4;border-radius:5px;padding:0.05em;padding-left:0.25em;padding-right:0.25em;text-align:left;text-decoration:none;position:relative;display:block}
#user-flag-menu .flg-btn.flg-active{background:rgba(255,255,255,0.9);color:#0a0a0a}
#user-flag-menu .flg-btn.flg-active:hover{background:rgba(255,255,255,0.7);color:#0a0a0a}
#user-flag-menu .flg-btn.flg-active:active{background:white;color:black}
#user-flag-menu .flg-btn{background:rgba(255,255,255,0.0);color:#f4f4f4}
#user-flag-menu .flg-btn:hover{background:rgba(255,255,255,0.3)}
#user-flag-menu .flg-btn:active{background:white;color:black}
#user-flag-menu .flg-btn.inactive, #user-flag-menu .flg-btn.inactive:hover, #user-flag-menu .flg-btn.inactive:active{background:transparent;color:#999}
#user-flag-menu .flg-btn.flg-active.inactive, #user-flag-menu .flg-btn.flg-active.inactive:hover, #user-flag-menu .flg-btn.flg-active.inactive:active{background:rgba(255,255,255,0.85);color:#777}
.blog-flg #user-flag-menu{background:rgba(204,204,204,0.6)}
.blog-flg #user-flag-menu .flg-btn{background:transparent;color:rgba(0,0,0,0.6)}
.blog-flg #user-flag-menu .flg-btn:hover{background:rgba(235,235,235,0.9);color:rgba(0,0,0,0.9)}
.blog-flg #user-flag-menu .flg-btn:active{background:white;color:black}
.blog-flg #user-flag-menu .flg-btn.flg-active{background:rgba(218,218,218,0.9);color:rgba(0,0,0,0.9)}
.blog-flg #user-flag-menu .flg-btn.flg-active:hover{background:rgba(235,235,235,0.9);color:rgba(0,0,0,0.9)}
.blog-flg #user-flag-menu .flg-btn.flg-active:active{background:white;color:black}
#user-flag-menu .controls a.help{color:#888;text-decoration:none;position:absolute;right:7px;bottom:5px;font-size:0.8em;font-weight:bold;padding:2px;padding-right:6px;padding-left:6px;border-radius:1em;background:#222}
.blog-flg #user-flag-menu .controls a.help{color:#555;background:#aaa}
#posts{/* For the flag menu */
padding-bottom:80px}
/* Ad posts */
.planet #posts .post.ad, .friends #posts .post.ad{border-width:1px 0 1px 0;border-style:solid;/*outline-width:1px;outline-style:solid;outline-offset:5px;*/}
.planet #posts .post.ad .ad-marker, .friends #posts .post.ad .ad-marker{display:inline-block;width:100%;text-align:right;font-size:10px;text-transform:uppercase}
.planet #posts .post_image.f_nsfw.ad .content img, .friends #posts .post_image.f_nsfw.ad .content img{-webkit-filter:blur(18px);filter:blur(18px)}
.planet #posts .post_image.f_nsfw.ad .content img:hover, .friends #posts .post_image.f_nsfw.ad .content img:hover{-webkit-filter:none;filter:none}
body.repost-iframe #repost-button{margin-right:0;padding-right:.4em;-moz-border-radius-topright:0;-moz-border-radius-bottomright:0;-webkit-border-top-right-radius:0;-webkit-border-bottom-right-radius:0;border-radius-topright:0;border-radius-bottomright:0}
body.repost-iframe #repost-button-without-to{margin-right:.1em;padding-right:.7em}
body.repost-iframe #repost-button-to{width:7px;height:15px;background-image:url('/images/small_arrow_down.gif');background-position:4px 7px;background-repeat:no-repeat;-moz-border-radius-topleft:0;-moz-border-radius-bottomleft:0;-webkit-border-top-left-radius:0;-webkit-border-bottom-left-radius:0}
body.repost-iframe #repost-container.repost-to-shown #repost-button-to{background-image:url('/images/small_arrow_right.gif');background-position:6px 5px;background-color:#333;-moz-border-radius-bottomright:0;-moz-border-radius-topleft:.3em;-moz-border-radius-topright:.3em;-webkit-border-bottom-right-radius:0;-webkit-border-top-left-radius:.3em;-webkit-border-top-right-radius:.3em;height:15px;margin-bottom:0;border-radius-bottomright:0;border-radius-topleft:.3em;border-radius-topright:.3em}
body.repost-to-iframe #repost-to{font-family:Arial,sans-serif;margin:0;padding:4px 5px;list-style:none;font-size:13px;-moz-border-radius:.3em;-webkit-border-radius:.3em;-moz-border-radius-topleft:0;-webkit-border-top-left-radius:0;line-height:1.4em;background-image:url('/skins/default/black80.png');cursor:pointer;width:12em;border-radius:.3em;border-radius-topleft:0}
body.repost-to-iframe #repost-to li{display:block}
body.repost-to-iframe #repost-to a{display:block;color:#fff;text-decoration:none;padding:.2em .5em .1em 22px;background-position:2px 2px;background-repeat:no-repeat;overflow:hidden}
body.repost-to-iframe #repost-to a:hover{background-color:#666}
.actionbar li a:focus{outline:none}/* Get rid of Firefox outline on click. */
.actionbar li a span{color:#d00}
.over ul.actionbar, .post .actionbar li.visible, .post .actionbar li.open{visibility:visible}
.post .actionbar li.visible a, .post .actionbar li.open a{background:url('/images/black50.png')}
body.repost-iframe #repost-container.repost-to-shown #repost-button, body.repost-iframe #repost-container.repost-to-shown #repost-button-without-to{background:url('/images/black50.png');-moz-border-radius:.3em;-webkit-border-radius:.3em;border-radius:.3em}
#reaction-iframe{border:2px solid #333;background:url('/images/spinner.gif') no-repeat center}
#reaction-iframe-container{border-top:0;behavior:url(/stylesheets/iepngfix.htc);clear:both;display:none;position:absolute;padding:10px;z-index:65;background:url('/images/reaction_shadow.png');width:450px;height:350px;margin-left:-225px}
input[type="checkbox"].toggle-button{display:none;float:right}
input[type="checkbox"].toggle-button + label,a.toggle-button{font-size:0.96em;display:block;color:#CCC;background-color:rgba(0,0,0,0.2);margin:5px 12px;padding:3px 4px;border-radius:0.4em}
input[type="checkbox"].toggle-button:not(.inverted) + label:hover, input[type="checkbox"].toggle-button.inverted:checked + label:hover
a.toggle-button:hover{color:#fdfdfd;background-color:#999}
input[type="checkbox"].toggle-button:not(.inverted):checked + label, input[type="checkbox"].toggle-button.inverted:not(:checked) + label{color:#555;background-color:rgba(255,255,255,0.9)}
a.toggle-button.logged-out#show-nsfw-toggle{background:transparent;color:#999 !important;margin:0px}
a.toggle-button.logged-out#show-nsfw-toggle:hover{color:#fdfdfd !important}
#hide-ads-toggle + label{margin-left:0}
.post_image .gallery-images .shown-image{display:block}
.post_image .gallery-images .post_image{display:none}
.post_image .gallery-images .sel{display:block}
body.galleries_off .post_image .gallery .gallery-thumbs{display:none}
body.galleries_off .post_image .gallery-images .post_image{display:block}
.hide-tags .tags{display:none}
.hide-tags .admin-edit .tags{display:block}
.hide-actionbar .actionbar{display:none}
.hide-repost .actionbar .repost{display:none}
.hide-reposted-by .reposted_by,.hide-reposted-by .reactions_by{display:none}
.post_event .dtstart{cursor:pointer}
.post_event .admin-edit .fieldcontainer, body.bookmarklet #event .fieldcontainer{clear:both;overflow:hidden}
.post_event .admin-edit .startdate label, .post_event .admin-edit .fieldcontainer label, body.bookmarklet #event .startdate label, body.bookmarklet #event .fieldcontainer label{float:left;width:25%}
.post_event .admin-edit .fieldcontainer .url, body.bookmarklet #event .fieldcontainer .url{float:left;width:60%}
.post_video .embed object{display:block}
.post_video .body{margin-top:.5em}
/* ADMIN BUTTONS */
body.toggle-iframe{margin:0}
#toggle-iframe{width:0;height:0;z-index:5}
#admin-hot, #toggle-container{list-style:none;margin:0;padding:0;z-index:4}
#admin-hot, #toggle-iframe{position:fixed;_position:absolute;left:0;bottom:32px}
#toggle-container{width:36px}
#admin-hot li, #toggle-container li{margin:0;padding:0;display:block;clear:both;zoom:1;/* IE haslayout */}
#toggle-container li{overflow:hidden}
#admin-hot li a, #toggle-container li a{display:block;float:left;width:32px;margin:0 0 2px 4px;padding:2px 0 0 0;zoom:1;/* IE haslayout */
background-color:#ccc;color:#000 !important;text-decoration:none;opacity:.6;filter:alpha(opacity=60);-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}
#toggle-container li a{padding:3px 0}
#toggle-container li a img{display:block}
#toggle-caption{position:fixed;visibility:hidden;font-size:12px;width:120px;text-align:center;padding:0 8px 0 15px;line-height:26px;height:27px;overflow:hidden;background:url(/images/black50_arr.png);-moz-border-radius:.3em;-webkit-border-radius:.3em;color:#ccc;border-radius:.3em}
#admin-hot.state_panel #toggle-caption, #admin.state_new #toggle-caption{visibility:hidden !important}
#admin-hot li#btn-options a, #admin-hot li#btn-panel a{margin-left:0;-moz-border-radius-topleft:0;-moz-border-radius-bottomleft:0;-webkit-border-top-left-radius:0;-webkit-border-bottom-left-radius:0;width:36px;border-radius-topleft:0;border-radius-bottomleft:0}
#admin-hot li#btn-options a{padding:2px 0 1px 0}
#admin ul.group li#btn-membership{margin-top:8px}
#admin-hot li.home a{background-position:center;display:block;height:24px}
#admin-hot li a:hover, #toggle-container li a:hover{color:#fff !important;opacity:.9;filter:alpha(opacity=90)}
#toggle-container li a.state-spinner img{visibility:hidden}
#admin-hot li#btn-new a{font-size:2em;line-height:17px;padding:3px 0}
#toggle-container li.sel a, #toggle-container li.member a, body.edit li#btn-edit a{opacity:1;filter:alpha(opacity=100);background-color:#0e0;color:#fff}
#toggle-container li#btn-suspicious.sel a{background-color:#ff8000}
#toggle-container li#btn-hidden.sel a, #toggle-container li#btn-content-warning.sel a, #toggle-container li#btn-spammer.sel a, #toggle-container li#btn-flag.sel a{background-color:#e11}
#toggle-container li.pending a{background-color:#c90}
#admin-hot li#btn-options.sel a, #admin-hot li#btn-panel.sel a{background-color:#ddd}
#admin-hot #btn-edit a span{font-family:'Times New Roman'}
/* MESSAGE */
#admin-message{position:fixed;bottom:2em;right:2em;opacity:0;/*margin:0 0 0 -40%;-7% 0 0 -40%*/
padding:0;-moz-border-radius:1.5em;-webkit-border-radius:1.5em;list-style:none;border:1px solid #fff;font-size:18px;font-family:Arial,sans-serif;padding:.6em 2em;color:#fff;text-align:center;z-index:998;background:url(/images/black50.png);border-radius:1.5em}
#admin-message a{background:url(/skins/default/white20.png);color:#fff;text-decoration:none;padding:.2em .5em;-moz-border-radius:.5em;-webkit-border-radius:.5em;margin-left:.6em;border-radius:.5em}
#admin-message a:hover{background:url(/skins/default/white40.png)}
#admin-message tt{font-size:.9em;margin-right:.3em}
#admin-message.progress,#admin-message.info{background-color:#C90}
#admin-message.progress a,#admin-message.info a{background-color:#960}
#admin-message.warning{background-color:#A00}
#admin-message.warning a{background-color:#c44}
#admin-message.invitation{background-color:#0A0}
#admin-message.invitation a{background-color:#4A4}
/* LIGHTBOX */
#lightbox-bg{display:none;position:fixed;left:0;top:0;width:100%;height:100%;background-repeat:no-repeat;background-position:center}
#lightbox{display:none;position:absolute;left:0;top:0;width:100%;height:100%;background-repeat:no-repeat;background-position:center}
#lightbox-bg{opacity:.8;filter:alpha(opacity=80);background:#000;z-index:100;cursor:pointer;cursor:-moz-zoom-out;cursor:-webkit-zoom-out}
#lightbox{z-index:101;cursor:pointer;cursor:-moz-zoom-out;cursor:-webkit-zoom-out}
a.lightbox{cursor:-moz-zoom-in;cursor:-webkit-zoom-in;/*cursor:url('/images/cursors/zoomin.cur');cursor:row-resize;*/}
/* SOUP BADGE */
#soup{position:absolute;right:3em;top:-5px;z-index:80}
#soup a{display:block}
#soup img{behavior:url(/stylesheets/iepngfix.htc)}
/* BUBBLE */
#bubble{display:none;position:absolute;width:250px;margin-top:0;font-size:.8em;opacity:.95;filter:alpha(opacity=95);z-index:99}
#bubble #bubblebit{background-image:url('/images/bubblebit.gif');background-repeat:no-repeat;background-position:130px 0;height:6px;font-size:1px}
#bubble #bubblepost{background:#000;padding:.5em;color:#fff}
#bubble #bubblepost a{color:#fff}
#bubble #bubblepost .post{margin:0}
#bubble #bubblepost blockquote{margin:0}
#bubble #bubblepost blockquote .quote{float:left}
#bubble #bubblepost .attribution{padding-top:.3em;text-align:right;font-size:.85em;color:#666}
#bubble.post #bubblepost .attribution{clear:both}
#bubble #bubblepost .attribution a{color:#999;font-weight:bold;text-decoration:none;margin-right:.3em}
#bubble #bubblepost .attribution a:hover{text-decoration:underline}
#bubble #bubblepost form{margin:0;clear:both}
#bubble .post_image .imagecontainer{width:auto !important;height:auto !important}
#bubble .post_video embed, #bubble .post_video object /*#bubble .post_video * */{display:none}
#bubble .post_video{background:transparent url(/images/icon_video.png) top center no-repeat;behavior:url(/stylesheets/iepngfix.htc);width:100%;padding-top:32px}
#bubble.wide{width:400px}
#bubble.wide .post_image img{display:none}
#bubble.user{font-size:12px !important;font-family:Arial,Helvetica,sans-serif !important;width:180px}
#bubble.user #bubblepost{padding:.3em .5em .5em .5em}
#bubble.user h4{font-size:1.3em;margin:0;padding-bottom:.2em;float:left}
#bubble.user h4 a{text-decoration:none}
#bubble.user ul.actions, #bubble.user ul.actions li{margin:0;padding:0;list-style:none}
#bubble.user ul.actions{overflow:hidden;clear:both;padding-top:.2em}
#bubble.user ul.actions li{float:left;width:49.5%;margin-right:1%}
#bubble.user ul.actions li.ignore{margin-right:0}
#bubble.user ul.actions li.flag{width:100%;margin:5px 0 0 0}
#bubble.user ul.actions li a{display:block;text-decoration:none}
#bubble.user ul.actions li a span{margin:1px 5px 0 1px;display:block;float:left;width:10px;height:10px;border:1px solid #444;background-position:1px 1px;background-repeat:no-repeat}
#bubble.user ul.actions li.true a span{background-image:url('/images/check.gif')}
#bubble.user ul.actions li a:hover span{background-image:url('/images/check0.gif')}
#bubble.user #bubblepost form p{margin:.3em 0 0 0}
#bubble.user #bubblepost .attribution{padding-top:.4em;margin-right:.3em}
#bubble.user #bubblepost .group{color:#999;clear:both;margin-top:.5em}
#bubble.user #bubblepost .group a{color:#999}
#bubble .xhr-container{clear:both;color:#999}
.latestpost{display:none}
/* ENDLESS SCROLLING */
.endlessnotice{display:none}
#endless_error.endlessnotice, #load_more.endlessnotice, #reload_notice.endlessnotice, #top_notice.endlessnotice{margin-bottom:2em}
#more_loading.endlessnotice{background:url(/images/spinner.gif) 0px 3px no-repeat;margin-bottom:4em}
#more_loading.endlessnotice, #load_more.endlessnotice, #reload_notice.endlessnotice, #top_notice.endlessnotice{padding-left:26px}
#reload_notice.endlessnotice{background:url(/images/spinner.gif) 0px 3px no-repeat}
#endless_error.endlessnotice{background-color:#fcc;color:#855;padding:.5em 1em;-moz-border-radius:.5em;border-radius:.5em}
#endless_error.endlessnotice strong{color:#000}
.state-spinner{background-image:url('/images/spinner.gif') !important;background-position:center !important;background-repeat:no-repeat !important}
/* admin+storefront */
ul.userlist{margin:0;padding:0;list-style:none}
ul.userlist li{margin:0 0 1px 0;padding:0;clear:both;height:24px;position:relative}
ul.userlist_grid li{float:right;clear:none;margin-left:1px}
ul.userlist li a.avatarlink{display:block;text-align:left;line-height:2em;margin-left:0}
ul.userlist li.over{background-color:#ddd}
ul.userlist li a.avatarlink img{float:left;margin:0 .5em 0 0;top:0}
ul.userlist li div.mutual{float:left;width:15px;line-height:2em;background:url('/images/mutual.gif') center no-repeat;margin-left:.3em;opacity:.3;filter:alpha(opacity=30);behavior:url(/stylesheets/iepngfix.htc);position:absolute;left:0;z-index:1}
ul.userlist li input.btn{visibility:hidden;float:left;font-size:1.1em !important;text-decoration:none;margin:.2em 0 0 .2em;padding:0 .2em;-moz-border-radius:.3em;-webkit-border-radius:.3em;color:#888;background-color:#eee;border:0;position:absolute;right:.2em;left:auto;cursor:pointer;z-index:2}
ul.userlist li input.btn:hover{background-color:#fff}
ul.userlist li.over input.btn{visibility:visible}
#admin-panel ul.userlist li a.avatarlink img{padding:4px 0 0 2px}
.switchable .switchable2{display:none}
.switchable_switched .switchable1{display:none}
.switchable_switched .switchable2{display:block}
#admin-panel .switchable1 a.admin-button, #admin-panel .switchable2 a.admin-button{font-size:.9em;float:right;margin-top:1.2em}
/* BAR */
#bar ol.notifications{margin:0;padding:0;list-style:none}
#bar ul#menu li.notifications ol.dropdown_body a, #bar ul#menu li.notifications .dropdown_head a{padding:0;display:inline}
#bar ul#menu li.notifications ol.dropdown_body img, #bar ul#menu li.notifications .dropdown_head a img{position:static;vertical-align:text-bottom;margin-right:0}
#bar ol.notifications li{float:none;padding:.1em 0;margin:0;line-height:1.5em;overflow:hidden}
#bar ol.notifications li.end{border-top:1px dotted #333;margin-top:.5em;padding-top:.5em}
#bar ul li.notifications a:hover{border-color:#fff}
#bar ol.notifications li.end a.rss{float:right;opacity:.5;border-bottom:0 !important}
#bar ol.notifications li.end a.rss:hover{opacity:1}
#bar ol.notifications li.end a img{behavior:url(/stylesheets/iepngfix.htc)}
#bar ol.notifications li.end a, #bar ul li .dropdown_body .sub .sub_head{font-size:.9em;text-transform:uppercase;color:#333}
#bar ul li .dropdown_body .sub{padding-bottom:3px;margin-top:3px;margin-bottom:3px;border-bottom:1px solid #333}
#bar ul li .dropdown_body .sub .sub_head{padding:5px 13px 2px 13px}
#bar ol.notifications li h2{font-weight:normal}
#bar ol.notifications li .quote{display:none}
#bar ol.notifications li .date{margin:.6em 0 0 0;color:#666;font-size:.9em}
#bar ol.notifications li .time{color:#666;margin-right:.5em;font-size:.9em}
#bar ul li.notifications .user_container, #bar ul li.notifications .user_container a{display:inline;font-weight:bold}
#bar ul li.notifications .user_container a{padding:.2em}
#bar ul li.notifications .user_container a:hover{background-color:#222;color:#000}
#bar ol.notifications li .post{padding:.8em;font-size:.9em;line-height:1.3em;margin-bottom:.5em;margin-left:3.65em;border-left:.5em solid #c0d0e0;overflow:hidden}
#bar,#barfade,#barbg{position:fixed;_position:absolute;/* ie6 */
width:100%;height:32px}
#bar{font-size:1.14em;z-index:89;opacity:.9;background:#333;color:#999}
#barfade{z-index:87;background:transparent url('/images/bar/fadeout.png')}
#barbg{position:absolute;background:transparent url('/images/bar/fadeblack.png');z-index:88}
#bar ul{list-style:none;margin:0;padding:0;overflow:hidden;float:left;height:32px;width:100%}
body.frontpage #bar ul{width:auto}
#bar ul li{margin:0;padding:0;float:left}
#bar ul li.notifications{float:right;margin-right:5px;width:450px}
#bar ul li.tryinfo{position:absolute;right:0;width:36em;height:32px;margin-right:4.1em;background:#000}
#bar ul li.notifications .dropdown_head{padding:4px 20px 12px 20px;font-size:.9em;line-height:2em}
#bar ul li.notifications .dropdown_head .time{font-size:.9em;color:#666;float:left;margin-right:1em;padding-top:.1em}
#bar ul li.notifications .dropdown_head a, #bar ul li .text a{display:inline;padding:0}
#bar ul li.notifications .dropdown_body{font-size:.9em;width:410px;padding:8px 20px;overflow:hidden}
#bar ul li.tryinfo .dropdown_body{width:36em;padding:0;overflow:hidden}
#bar ul li.tryinfo div.text{overflow:auto}
#bar ul li.tryinfo div.over a.signup{display:none}
#bar ul li.tryinfo div div.signup{display:none}
#bar ul li.tryinfo div.over div.signup{display:block;font-weight:bold;color:#FFEBC1;float:left}
#bar ul li.tryinfo div a.cancel{display:none}
#bar ul li.tryinfo div.over a.cancel{display:block;float:right;font-weight:normal;font-size:.9em}
#bar ul li.tryinfo div.over span.info{display:none}
#bar ul li a{display:block}
#bar ul li a.tv{float:right}
#bar ul#menu li.soup{margin-right:5px;float:right}
body.frontpage #bar ul#menu{padding-left:175px}
#bar ul#menu li a,#bar ul#menu li .text{color:#999;padding:8px 14px}
#bar ul#menu li.tryinfo .text{color:#AA9988;padding:8px 1em}
#bar ul#menu li.tryinfo .text a{color:#FFEBC1;padding:0;text-decoration:underline !important}
#bar ul#menu li .dropdown_body{overflow-y:auto}
#bar ul#menu li .dropdown_body a{padding-top:6px;padding-bottom:6px}
#bar ul#menu li.people .dropdown_body a{padding-right:3.3em}
#bar ul#menu li .dropdown_body a.tv{padding:5px 13px 7px 5px}
#bar ul#menu li .dropdown_body a.tv span, .post a.tv_promo{color:#777;background:#222;padding:2px 5px;border-radius:.5em;-moz-border-radius:.5em;-webkit-border-radius:.5em;font-size:.6em}
#bar ul#menu li .dropdown_body a.tv:hover span{color:#000;background:#fff}
.post a.tv_promo{float:right;color:#999 !important;background:#000 url('/images/tvicon.gif') 7px 1px no-repeat;text-decoration:none;-moz-border-radius-topleft:0;-moz-border-radius-topright:0;-webkit-border-top-left-radius:0;-webkit-border-top-right-radius:0;line-height:1.7em;margin-left:1em;padding:0 .8em 0 25px;font-size:11px;border-radius-topleft:0;border-radius-topright:0}
.post a.tv_promo:hover{background-color:#333;color:#fff !important}
#bar ul#menu li .dropdown_body a.btn{padding:3px 20px;text-align:center}
#bar ul#menu li.soup a{padding:8px 13px}
#bar ul#menu li.soup .dropdown_body a{padding:5px 13px}
#bar ul#menu li.soup a.dropdown_head{padding-right:17px !important}
#bar ul#menu li a img{vertical-align:bottom;margin-right:5px}
#bar ul#menu li div.dropdown_body a img{vertical-align:inherit}
#bar ul#menu a{text-decoration:none}
#bar ul#menu a:hover{text-decoration:underline}
#bar ul#menu .notifications a{border-bottom:1px solid #333}
#bar .content{position:relative}
#bar ul#util .login a:hover{text-decoration:underline}
body.loggedin #bar ul#menu li a, #bar ul#menu li.sel a{margin-top:0;font-size:1em}
#bar ul#menu li.sel a{background:#44c1d9;color:#000}
#bar ul#menu li.sel a:hover{text-decoration:none}
#bar ul#util{float:right}
#bar ul#util li a, #bar ul#util li a{color:#666;text-decoration:none;padding:8px 15px}
#bar a.dropdown_head{background-image:url('/images/bar/drop.gif');background-repeat:no-repeat;background-position:89% 15px;padding-right:25px !important}
#bar ul li.login a.dropdown_head{background-image:none}
#bar ul li.soup a.dropdown_head{background-position:35px 15px}
#bar ul li.notifications a.dropdown_head{background-position:98% 15px}
#bar ul li.over .dropdown_head, #bar ul li.over a.dropdown_head{background-color:#000}
#bar ul li.people .dropdown_body div:hover a.tv{color:#999 !important}
#bar ul li.over a.dropdown_head, #bar ul li a:hover, #bar ul li.people .dropdown_body div:hover a, #bar ul li.people .dropdown_body div:hover a.tv:hover{color:#fff !important}
body.loggedin #bar ul li.over a.dropdown_head, body.loggedin #bar ul li a:hover{text-decoration:none !important}
.dropdown .dropdown_body{display:none;background:#000;position:absolute;top:2.2em;padding-bottom:.4em;z-index:99;color:#999}
body.frontpage #bar ul li.over a.dropdown_head, body.frontpage .dropdown .dropdown_body{background-color:#333}
.over .dropdown_body{display:block !important}
#bar ul li.soup .dropdown_body{width:130px;margin-left:-79px}
#bar ul#util li.login{width:65px}
#bar ul#util li.language .dropdown_body{right:65px;width:120px}
#bar ul#util li.login .dropdown_body{right:0;width:320px}
#bar ul#util li.language .dropdown_body a{display:block;margin:0;padding:.2em 30px .2em 12px;width:78px;text-align:right;color:#999}
#bar ul .es a.es, #bar ul .cs a.cs, #bar ul .it a.it, #bar ul .eo a.eo, #bar ul .pl a.pl, #bar ul .pt a.pt, #bar ul .fr a.fr, #bar ul .de a.de, #bar ul .en a.en{background-image:url('/images/check.gif');background-position:96px 6px;background-repeat:no-repeat}
#bar ul#util li.login .dropdown_body{padding:1em}
#bar ul#util li.login .dropdown_body label{overflow:hidden;clear:both}
#bar ul#util li.login .dropdown_body label span{display:block;float:left;width:6em;color:#aaa;padding-top:5px}
#bar ul#util li.login .dropdown_body label input{width:224px;font-size:1.2em;border:0;padding:3px;margin-bottom:2px}
input.loginbutton,input.cancelbutton, .logging-in{padding:.2em 16px .2em 32px;margin:.2em 0 0 0}
input.loginbutton{float:left;font-size:16px !important;border:0;background:#fc6 url(/images/storefront/padlock.gif) 11px no-repeat;color:#660;-moz-border-radius:.9em;-webkit-border-radius:.9em;cursor:pointer;line-height:1.45em;border-radius:.9em}
input.cancelbutton{float:left;font-size:16px !important;border:0;background:#D9534F;color:#FFFFFF;-moz-border-radius:.9em;-webkit-border-radius:.9em;cursor:pointer;line-height:1.45em;margin-left:1em;border-radius:.9em}
.logging-in{font-style:italic;padding-left:24px;background:url('/images/spinner.gif') no-repeat left;display:none}
#bar ul#util li.login .dropdown_body input.loginbutton{font-size:14px !important;margin-left:6em}
#bar ul#util li.login p{margin:0}
a.login_forgot{float:left;padding:.7em 0 0 1em;font-size:.9em;text-decoration:underline !important}
#bar ul#util li a.login_forgot{font-size:.8em;padding:.7em 0 0 .6em}
#bar a.login_forgot:hover{color:#ccc}
#bar a.btn{display:block !important;margin-top:.4em;-moz-border-radius:.5em;-webkit-border-radius:.5em;background:#444;color:#ccc;border-radius:.5em}
#bar a.btn:hover{background:#666;color:#fff}
#bar{font-family:'Lucida Grande','Lucida Sans Unicode','Lucida Sans',Arial,sans-serif;font-size:14px;left:0;top:0}
#barbg,#barfade{left:0;top:0}
body.loggedin{margin-top:32px}
body.loggedin #soup{top:27px}
body.loggedin #admin .panelcontainer2{margin-top:10px}
/* TUTORIAL */
body.tutorial_active #barcontainer{display:none}
body.tutorial_active{margin-top:0 !important}
body.tutorial_active #admin{top:0px}
body.tutorial_active #soup{top:-5px !important}
.shadedbox{position:fixed;font-size:12px;font-family:Verdana,Arial,Helvetica,sans-serif;opacity:0;/*filter:alpha(opacity=0);*/
z-index:99;bottom:60px;/* default size & pos are for tutorial */
right:60px;width:270px}
.shadedbox p, body.login-iframe p{margin:.5em 0}
.shadedbox .shadow, .shadedbox .box{-moz-border-radius:1em;-webkit-border-radius:1em;border-radius:1em}
.shadedbox .shadow{position:absolute;left:0px;top:0px;width:228px;padding:21px;background:#000;opacity:.3;z-index:100;-moz-border-radius:1.5em;-webkit-border-radius:1.5em;filter:alpha(opacity=30);border-radius:1.5em}
.shadedbox .box{position:relative;left:6px;top:6px;width:228px;padding:15px;background:#fff;color:#000;z-index:102;filter:alpha(opacity=100)}
.shadedbox .arrow{display:none;position:absolute;z-index:101;background:url(/images/tutorial/arr_bottom.png) left top no-repeat;width:12px;height:14px}
.shadedbox .character{display:none;position:absolute;top:-9px;left:19px;z-index:102;background:url(/images/tutorial/monster_hello.png) left top no-repeat;width:137px;height:150px}
#tutorial.step0{left:50%;top:50%;bottom:auto;right:auto;width:448px;margin-left:-225px;margin-top:-120px}
#tutorial.step0 .shadow{width:280px;padding:20px 10px 27px 160px}
#tutorial.step0 .box{width:268px;padding:20px 10px 15px 160px}
#tutorial.step0 .character{display:block}
#tutorial.initialimport{left:50%;top:50%;bottom:auto;right:auto;width:528px;margin-left:-265px;margin-top:-150px}
#tutorial.initialimport .shadow{width:338px;padding:26px 26px 21px 166px}
#tutorial.initialimport .box{width:338px;padding:20px 20px 15px 160px}
.shadedbox h3{color:#c60404;font-family:Arial,Helvetica,sans-serif;font-size:1.8em;letter-spacing:-.02em}
.shadedbox .btns{margin-top:1.7em;overflow:hidden}
.shadedbox a.btn,a.pillbtn{display:block;float:left;-moz-border-radius:1em;-webkit-border-radius:.9em;padding:.4em 1em;text-decoration:none;background-color:#ddd;color:#666;border-radius:1em}
.shadedbox a.btn:hover,a.pillbtn:hover{background-color:#bbb;color:#000}
.shadedbox a.btn{color:#fff !important;background-color:#c60404}
.shadedbox a.btn:hover{background-color:#a50404}
.shadedbox a.skip{margin-left:.5em;background-color:#999}
.shadedbox a.skip:hover{background-color:#666}
.shadedbox a.next{color:#777;float:right;padding-top:.5em}
#tutorial p.bmlet{padding-top:.5em;margin-bottom:0}
.shadedbox .close{position:absolute;display:block;right:0;top:0;z-index:103;text-decoration:none;font-size:1.3em;margin-right:15px;margin-top:10px;color:#d0d0d0}
.shadedbox .close:hover{color:#999}
#tutorial.step1, #tutorial.step2, #tutorial.step4, #tutorial.step6, #tutorial.step7, #tutorial.step8{width:450px}
#tutorial.step1 .box,/* wtf,ie8?! */
#tutorial.step1 .shadow, #tutorial.step2 .box, #tutorial.step2 .shadow, #tutorial.step4 .box, #tutorial.step4 .shadow, #tutorial.step6 .box, #tutorial.step6 .shadow, #tutorial.step7 .box, #tutorial.step7 .shadow, #tutorial.step8 .box, #tutorial.step8 .shadow{width:408px}
#tutorial.step0 .close{display:none}
#tutorial.step1 .arrow{display:block;bottom:-20px;left:20px}
#tutorial.step1{left:0px;bottom:132px;right:auto}
/* 2 content types */
#tutorial.step2{left:40px;bottom:120px}
/* 4-5 edit mode */
#tutorial.step4, #tutorial.step5{left:45px;bottom:51px}
#tutorial.step4 .arrow, #tutorial.step5 .arrow{display:block;bottom:10px;left:-6px;background:url(/images/tutorial/arr_left.png) left top no-repeat}
body.tutorial_step5 #header #descriptioncontainer iframe{border-color:#c60404}
body.tutorial_step5 #header #descriptioncontainer input.submit{background-color:#c60404}
/* 6-7 bookmarklet */
#tutorial.step6,#tutorial.step7{left:20px;top:5px}
/*#tutorial.step6 .arrow,#tutorial.step7 .arrow{display:block;top:-6px;left:20px;background:url(/images/tutorial/arr_top.png) left top no-repeat}*/
/* 8-9 customization */
#tutorial.step8{left:45px;bottom:22px}
#tutorial.step8 .arrow{display:block;top:22px;left:-6px;background:url(/images/tutorial/arr_left.png) left top no-repeat}
#tutorial.step9{top:10px;bottom:auto;left:10px}
#tutorial.step9 .arrow{display:block;bottom:-20px;left:22px}
body.tutorial_step9 #admin-panel{padding-top:40px}
/* 10 end */
#tutorial.step10{top:40px;right:90px;bottom:auto}
#tutorial.step10 .box{padding-bottom:5px}
#tutorial.step10 .shadow{padding-bottom:11px}
#tutorial.step10 .arrow{display:block;top:-6px;right:20px;background:url(/images/tutorial/arr_top.png) left top no-repeat}
#tutorial.step10 .close{display:none}
#tutorial.step10 .character{display:block;right:6px;bottom:-6px;left:auto;top:auto;z-index:102;background:url(/images/tutorial/monster_bye.png) left top no-repeat;width:104px;height:119px}
#tutorial.step10 a.next{float:none;display:block;clear:left;color:#999;font-size:.95em;padding-top:1em}
#loginortry .shadedbox{font-size:15px;font-family:Arial,Helvetica,sans-serif;line-height:1.4em;opacity:1;width:670px;left:50%;top:50%;margin-left:-330px;margin-top:-180px;right:auto;bottom:auto}
#loginortry .shadedbox_div{width:598px;height:260px;padding:25px;padding-top:5px}
#loginortry .shadow{width:610px;height:272px}
#loginortry .reaction_tutorial .shadow{height:332px}
#loginortry .reaction_tutorial .box{height:320px}
#loginortry .reaction_tutorial .login-container{height:170px}
#loginortry .box{background-image:url('/images/soup_badge.png');background-position:580px -5px;background-repeat:no-repeat}
#login-iframe{width:0;height:0}
body.login-iframe{font-size:15px;font-family:Arial,Helvetica,sans-serif;line-height:1.4em;margin:0;background-color:#fff}
body.login-iframe .loginform{font-size:.8em;color:#777;line-height:1.2em;width:186px}
#loginortry .login-container{float:right;margin-left:1.5em;border-left:1px dotted #ddd;padding-left:1.5em;width:31%;height:150px;background:url('/images/spinner.gif') no-repeat center}
body.login-iframe .loginform h4{font-size:1.3em;letter-spacing:-.02em;margin-top:0;margin-bottom:.5em}
body.login-iframe .loginform p{padding:0}
body.login-iframe .loginform input.loginbutton, body.login-iframe .loginform .logging-in{color:#777}
body.login-iframe .loginform input.loginbutton{background-color:#ddd;font-size:12px !important}
body.login-iframe .loginform a.login_forgot{display:none;font-size:.8em;color:#777;padding-left:.5em}
body.login-iframe .error{color:#CC0000}
body.login-iframe .submitted .loginbutton{display:none}
body.login-iframe .submitted .logging-in{display:block}
#loginortry h3{background:url(/images/tutorial/monster_cut.png) bottom left no-repeat;padding-left:60px;padding:1.2em 0 .5em 100px;border-bottom:1px solid #ddd;margin-top:0;margin-bottom:1em;color:#000;/*39F*/
overflow:hidden;font-size:1.5em}
#loginortry p{padding:0 0 .6em 0}
#loginortry .trypromo{padding-bottom:2em}
#loginortry .trypromo .pillbtn{background-color:#fc6;/*c60404;*/
color:#660 /*fff*/}
#loginortry .trypromo .or{float:left;font-size:.85em;color:#888;padding:.5em 0 0 1em}
#loginortry .trypromo .or a{color:inherit;padding-left:.5em}
#loginortry .quicksignup .explanation{margin:-.4em 0 0 0}
#loginortry .quicksignup form p{margin:0;padding:0 0 1px 0}
#loginortry .quicksignup form label{float:left;clear:left;width:6em;padding-top:.1em}
#loginortry .quicksignup form input{width:13em;font-size:.9em}
#loginortry .quicksignup form input.submit{width:auto;padding:.2em 16px .2em 16px;margin:.2em 0 0 5.5em;float:left;font-size:1.1em;border:0;background:#fc6;color:#660;-moz-border-radius:.9em;-webkit-border-radius:.9em;cursor:pointer;line-height:1.45em;border-radius:.9em}
#loginortry .quicksignup .nothanks{color:#888;margin-left:9em;font-size:.9em;margin-top:.6em;position:absolute}
/* BASIC TOGGLING FUNCTIONS */
.toggle .toggle1{display:block}
.toggle .toggle2{display:none}
.state-toggled .toggle1{display:none}
.state-toggled .toggle2{display:block}
/* Hide horrible AddThis flash embed */
object#atff{display:none}
div#descriptioncontainer *{z-index:0 !important}
/* Ad related stuff for user soups */
#adlayoutcontainer{width:100%;margin:0 auto}
#rightfold{height:100%;margin-right:0px;overflow:hidden !important;/* FF Scroll-leiste */}
#unspeakablecontainer{/*padding-top:10px;*/
height:100%;float:right;width:0px;margin-left:0px;/*background-color:#98fb98 !important;*/
/*color:#ffffff;*/
overflow:hidden !important;/* FF Scroll-leiste */}
@media all and (min-device-width:1200px){body.showads #rightfold{height:100%;margin-right:304px;overflow:hidden !important;/* FF Scroll-leiste */}
body.showads #unspeakablecontainer{width:304px;margin-left:-305px}
body.showads #soup{right:350px}
body.showads #placement{right:0px;width:304px;height:100%;position:fixed;background-color:#1e1e1e;top:0px}
body.showads.loggedin #placement{top:32px}
body.showads #soupbanner{margin-top:2px;margin-left:2px;margin-right:2px}
body.showads .banner{margin-bottom:2px}
body.showads .banner img{border:0}}
#wrapleft{height:100%;float:left;width:100%;/*background-color:#cfcfcf;*/}
/* PAYUP INTERSTITIAL */
#payuptint.inactive,#payupinterstitial.inactive{display:none}
#payuptint{position:fixed;top:0;left:0;background:rgba(0,0,0,0.6);z-index:5;width:100%;height:100%;/*display:none;*/}
#payupinterstitial{animation:none;animation-delay:0;animation-direction:normal;animation-duration:0;animation-fill-mode:none;animation-iteration-count:1;animation-name:none;animation-play-state:running;animation-timing-function:ease;backface-visibility:visible;background:0;background-attachment:scroll;background-clip:border-box;background-image:none;background-origin:padding-box;background-position:0 0;background-position-x:0;background-position-y:0;background-repeat:repeat;background-size:auto auto;border-style:none;border-width:medium;border-color:inherit;border-bottom:0;border-bottom-color:inherit;border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom-style:none;border-bottom-width:medium;border-collapse:separate;border-image:none;border-left:0;border-left-color:inherit;border-left-style:none;border-left-width:medium;border-radius:0;border-right:0;border-right-color:inherit;border-right-style:none;border-right-width:medium;border-spacing:0;border-top:0;border-top-color:inherit;border-top-left-radius:0;border-top-right-radius:0;border-top-style:none;border-top-width:medium;bottom:auto;box-shadow:none;box-sizing:content-box;caption-side:top;clear:none;clip:auto;color:inherit;columns:auto;column-count:auto;column-fill:balance;column-gap:normal;column-rule:medium none currentColor;column-rule-color:currentColor;column-rule-style:none;column-rule-width:none;column-span:1;column-width:auto;content:normal;counter-increment:none;counter-reset:none;cursor:auto;direction:ltr;display:inline;empty-cells:show;float:none;font:normal;font-size:medium;font-style:normal;font-variant:normal;font-weight:normal;hyphens:none;letter-spacing:normal;line-height:normal;list-style:none;list-style-image:none;list-style-position:outside;list-style-type:disc;margin-bottom:0;margin-right:0;max-height:none;max-width:none;min-height:0;min-width:0;opacity:1;orphans:0;outline:0;outline-color:invert;outline-style:none;outline-width:medium;overflow:visible;overflow-x:visible;overflow-y:visible;padding:0;padding-bottom:0;padding-left:0;padding-right:0;padding-top:0;page-break-after:auto;page-break-before:auto;page-break-inside:auto;perspective:none;perspective-origin:50% 50%;/* May need to alter quotes for different locales (e.g fr) */
quotes:'\201C' '\201D' '\2018' '\2019';right:auto;tab-size:8;table-layout:auto;text-align:inherit;text-align-last:auto;text-decoration:none;text-decoration-color:inherit;text-decoration-line:none;text-decoration-style:solid;text-indent:0;text-shadow:none;text-transform:none;transform:none;transform-style:flat;transition:none;transition-delay:0s;transition-duration:0s;transition-property:none;transition-timing-function:ease;unicode-bidi:normal;vertical-align:baseline;visibility:visible;white-space:normal;widows:0;word-spacing:normal;font-family:'Open Sans',Opensans,'Liberation Sans','Lucida Grande','Lucida Sans Unicode','Lucida Sans',Arial,sans-serif,sans;height:480px;width:710px;left:50%;top:50%;margin:0 auto;margin-top:-240px;margin-left:-355px;position:fixed;z-index:100;/*display:none;*/
border:0px;background-color:#f2f2f2}
#payupinterstitial #titlebar{background-color:#303030;margin:auto;height:60px;width:100%}
#payupinterstitial #titlebar h2#title{margin-top:0px;padding-top:0px;font-family:'Open Sans','Opensans','Liberation Sans','Lucida Grande','Lucida Sans Unicode','Lucida Sans',Arial,sans-serif,sans;font-weight:600;font-size:20px;line-height:20px;text-transform:uppercase;color:#f2f2f2;line-height:60px;padding-left:20px}
#payupinterstitial #soupup{font-family:'Open Sans','Opensans','Liberation Sans','Lucida Grande','Lucida Sans Unicode','Lucida Sans',Arial,sans-serif,sans;font-weight:400;margin-top:15px;font-size:16px;height:16px;color:#000000;padding-left:25px}
#payupinterstitial #left{padding-top:30px;float:left;width:460px}
#payupinterstitial .offerbox{font-weight:400;font-size:10px;float:left;margin-left:20px;cursor:pointer;cursor:hand}
#payupinterstitial .offerbox.half{width:210px}
#payupinterstitial .offerbox.full{width:440px}
#payupinterstitial .price{font-size:26px;font-weight:600}
#payupinterstitial .offerbox:hover .price{color:#d10f0f}
#payupinterstitial h3.title{font-size:14px;height:17px;font-weight:600;border-bottom:solid 1px black;text-transform:uppercase;padding-bottom:4px;margin-bottom:0px}
#payupinterstitial .offerbox:hover h3.title{color:#d10f0f}
#payupinterstitial #soupup{margin-left:20px;padding-left:0px}
#payupinterstitial .offerbox ul{padding-left:0px;list-style-position:inside;font-size:12px;margin-top:0px}
#payupinterstitial blockquote{padding-left:0px;margin-left:0px;font-size:11px;font-weight:400;font-style:italic}
#payupinterstitial #right{float:left;width:210px;height:320px;background-color:#d10f0f;color:#ffffff;margin-left:20px;margin-top:49px}
#payupinterstitial #right h3{margin-top:10px;margin-left:10px;margin-right:10px;font-size:14px;font-weight:600;border-bottom:solid 1px white;text-transform:uppercase;padding-bottom:6px;margin-bottom:0px}
#payupinterstitial #right ul{padding-left:25px;margin-right:10px;list-style-position:outside;font-size:11px;margin-top:10px}
#payupinterstitial #right li{margin-top:5px}
#payupinterstitial #right em{font-weight:400}
#payupinterstitial .remark{margin-left:10px;font-weight:200;font-size:12px}
#payupinterstitial .up{color:#d10f0f;font-weight:600}
#payupinterstitial .upsoup{color:#d10f0f;font-weight:400}
#payupinterstitial #infinitynines{background:-webkit-linear-gradient(0deg,#111111,#dddddd);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
#payupinterstitial .offerbox:hover #infinitynines{background:-webkit-linear-gradient(0deg,#d10f0f,#dddddd);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
#payupinterstitial #oink{position:absolute;width:50px;height:30px;right:10px;top:13px}
#payupinterstitial a{text-decoration:inherit;color:black}
#menu #oink{margin-left:-5px;position:absolute;margin-top:-2px;width:24px;height:19px}

» Show original CSS code

« Hide original CSS code

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,600,400italic);

/* FUNCTIONALITY + UI STYLES */
/* Included on all pages of Soup */
/* enforced even with custom CSS */

.hidden { display: none }

iframe.hidden {
  display: block;
  border: 0;
  width: 0;
  height: 0;
  visibility: hidden;
  position: absolute;
}

a img { border: 0; }

.admin-edit input {
  font-family: inherit;
  font-size: inherit; 
  font-weight: inherit;
  font-style: inherit;
}

.sparkline { display: none; }

#remote-iframe-container {
  position: absolute;
  top: 0;
  left: 0;
}
#repost-iframe, #repost-to-iframe {
  visibility: hidden;
  z-index: 60;
  position: absolute;
  width: 1;
  height: 1;
}

.actionbar, body.repost-iframe #repost-container {
  font-size: 11px !important;
  line-height: 15px !important;
  font-family: Arial, sans-serif;
}

body.repost-iframe #repost-container {
  float: left;
}

body.repost-iframe, body.repost-to-iframe {
  margin: 0;
}

.flag-summary {
  margin-bottom: 120px;
}

.actionbar {
  position: absolute;
  z-index: 50;
  right: 1em;
  margin: 0 0 0 0;
  margin-top: 6px;
  padding: 0 2px;
  background: url(/images/black50.png);
  -moz-border-radius: 1em;
  -webkit-border-radius: 1em;
  visibility: hidden;
  border: 1px solid #fff;
  border-radius: 1em;
}

#actionbar_arrow_up {
  display: none;
  position: absolute;
  margin-left: -11px;
  margin-top: 3px;
  z-index: 59;
}

.actionbar li {
  list-style-type: none;
  float: left;
  margin: 2px 0;
}

body.repost-iframe a, .actionbar li a {
  display: block;
  float: left;
  text-align: center;
  -moz-border-radius: .8em;
  -webkit-border-radius: .8em;
  color: #fff !important;
  padding: 2px 6px 2px 6px;
  font-weight: bold;
  text-transform: uppercase;
  text-decoration: none;  
  letter-spacing: -.02em;
}

.actionbar li a.hidden {
  display: none;
}

.actionbar li.permalink a {
  opacity: .5;
  filter: alpha(opacity=50);
}

.post .actionbar li a:hover,
body.repost-iframe a:hover {
  background: #fff;
  color: #666 !important;
}

body.permalink .actionbar li.permalink { display: none; }

.actionbar li.first a {
  padding-left: .8em;
}

.actionbar li.last a {
  padding-right: .8em;
}

.actionbar .flag a {
  font-size: 0px;
  width: 10px;
  height: 15px;
  background-image: url("/images/icon_flag_white.png");
  background-size: 12px 12px;
  background-repeat: no-repeat;
  background-position: 3px 4px;
}

.post .actionbar li.flag a:hover{
  background-image: url("/images/icon_flag_gray.png");
  background-size: 12px 12px;
  background-repeat: no-repeat;
  background-position: 3px 4px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
}

body.user-flag-menu-iframe {
  margin: 0px;
}

#user-flag-menu {
  margin: 0px;

background: rgba(0,0,0,0.8);
  padding: 6px;

border-radius: 4px;

position: relative;

color: white;
  list-style: none;
}

#user-flag-menu li {
  padding-top: 4px;
  padding-bottom: 4px;
}

#user-flag-menu .flg-btn {
  border: 0px solid #f4f4f4;
  border-radius: 5px;

padding: 0.05em;
  padding-left: 0.25em;
  padding-right: 0.25em;

text-align: left;
  text-decoration: none;

position: relative;

display: block;
}

#user-flag-menu .flg-btn.flg-active {
  background: rgba(255,255,255,0.9);
  color: #0a0a0a;
}

#user-flag-menu .flg-btn.flg-active:hover {
  background: rgba(255,255,255,0.7);
  color: #0a0a0a;
}

#user-flag-menu .flg-btn.flg-active:active {
  background: white;
  color: black;
}

#user-flag-menu .flg-btn {
  background: rgba(255,255,255,0.0);
  color: #f4f4f4;
}

#user-flag-menu .flg-btn:hover {
  background: rgba(255,255,255,0.3);
}

#user-flag-menu .flg-btn:active {
  background: white;
  color: black;
}

#user-flag-menu .flg-btn.inactive,
#user-flag-menu .flg-btn.inactive:hover,
#user-flag-menu .flg-btn.inactive:active {
  background: transparent;
  color: #999;
}

#user-flag-menu .flg-btn.flg-active.inactive,
#user-flag-menu .flg-btn.flg-active.inactive:hover,
#user-flag-menu .flg-btn.flg-active.inactive:active {
  background: rgba(255,255,255,0.85);
  color: #777;
}

.blog-flg #user-flag-menu {
  background: rgba(204, 204, 204, 0.6);
}

.blog-flg #user-flag-menu .flg-btn {
  background: transparent;
  color: rgba(0,0,0,0.6);
}

.blog-flg #user-flag-menu .flg-btn:hover {
  background: rgba(235, 235, 235, 0.9);
  color: rgba(0,0,0, 0.9);
}

.blog-flg #user-flag-menu .flg-btn:active {
  background: white;
  color: black;
}

.blog-flg #user-flag-menu .flg-btn.flg-active {
  background: rgba(218,218,218,0.9);
  color: rgba(0,0,0, 0.9);
}

.blog-flg #user-flag-menu .flg-btn.flg-active:hover {
  background: rgba(235, 235, 235, 0.9);
  color: rgba(0,0,0, 0.9);
}

.blog-flg #user-flag-menu .flg-btn.flg-active:active {
  background: white;
  color: black;
}

#user-flag-menu .controls a.help {
  color: #888;
  text-decoration: none;
  position: absolute;
  right: 7px;
  bottom: 5px;
  font-size: 0.8em;
  font-weight: bold;

padding: 2px;
  padding-right: 6px;
  padding-left: 6px;
  border-radius: 1em;
  background: #222;
}

.blog-flg #user-flag-menu .controls a.help {
  color: #555;
  background: #aaa;
}

#posts {
  /* For the flag menu */
  padding-bottom: 80px;
}

/* Ad posts */

.planet #posts .post.ad,
.friends #posts .post.ad {
  border-width: 1px 0 1px 0;
  border-style: solid;
  /*outline-width: 1px;
  outline-style: solid;
  outline-offset: 5px;*/
}

.planet #posts .post.ad .ad-marker,
.friends #posts .post.ad .ad-marker {
  display: inline-block;
  width: 100%;
  text-align: right;
  font-size: 10px;
  text-transform: uppercase;
}

.planet  #posts .post_image.f_nsfw.ad .content img,
.friends #posts .post_image.f_nsfw.ad .content img {
  -webkit-filter: blur(18px);
  filter: blur(18px);
}

.planet  #posts .post_image.f_nsfw.ad .content img:hover,
.friends #posts .post_image.f_nsfw.ad .content img:hover {
  -webkit-filter: none;
  filter: none;
}

body.repost-iframe #repost-button {
  margin-right: 0;
  padding-right: .4em;
  -moz-border-radius-topright: 0;
  -moz-border-radius-bottomright: 0;
  -webkit-border-top-right-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  border-radius-topright: 0;
  border-radius-bottomright: 0;
}
body.repost-iframe #repost-button-without-to {
  margin-right: .1em;
  padding-right: .7em;
}
body.repost-iframe #repost-button-to {
  width: 7px;
  height: 15px;
  background-image: url('/images/small_arrow_down.gif');
  background-position: 4px 7px;
  background-repeat: no-repeat;
  -moz-border-radius-topleft: 0;
  -moz-border-radius-bottomleft: 0;
  -webkit-border-top-left-radius: 0;
  -webkit-border-bottom-left-radius: 0;
}
body.repost-iframe #repost-container.repost-to-shown #repost-button-to {
  background-image: url('/images/small_arrow_right.gif');
  background-position: 6px 5px;
  background-color: #333;
  -moz-border-radius-bottomright: 0;
  -moz-border-radius-topleft: .3em;
  -moz-border-radius-topright: .3em;
  -webkit-border-bottom-right-radius: 0;
  -webkit-border-top-left-radius: .3em;
  -webkit-border-top-right-radius: .3em;
  height: 15px;
  margin-bottom: 0;
  border-radius-bottomright: 0;
  border-radius-topleft: .3em;
  border-radius-topright: .3em;
}

body.repost-to-iframe #repost-to {
  font-family: Arial, sans-serif;
  margin: 0;
  padding: 4px 5px;
  list-style: none;
  font-size: 13px;
  -moz-border-radius: .3em;
  -webkit-border-radius: .3em;
  -moz-border-radius-topleft: 0;
  -webkit-border-top-left-radius: 0;
  line-height: 1.4em;
  background-image: url('/skins/default/black80.png');
  cursor: pointer;
  width: 12em;
  border-radius: .3em;
  border-radius-topleft: 0;
}
body.repost-to-iframe #repost-to li {
  display: block;  
}
body.repost-to-iframe #repost-to a {
  display: block;
  color: #fff;
  text-decoration: none;
  padding: .2em .5em .1em 22px;
  background-position: 2px 2px;
  background-repeat: no-repeat;
  overflow: hidden;
}
body.repost-to-iframe #repost-to a:hover {
  background-color: #666;
}

.actionbar li a:focus { outline: none; } /* Get rid of Firefox outline on click. */
.actionbar li a span { color: #d00; }

.over ul.actionbar,
.post .actionbar li.visible,
.post .actionbar li.open {
  visibility: visible;
}

.post .actionbar li.visible a,
.post .actionbar li.open a {
  background: url('/images/black50.png');
}

body.repost-iframe #repost-container.repost-to-shown #repost-button,
body.repost-iframe #repost-container.repost-to-shown #repost-button-without-to {
  background: url('/images/black50.png');
  -moz-border-radius: .3em;
  -webkit-border-radius: .3em;
  border-radius: .3em;
}

#reaction-iframe {
  border: 2px solid #333;
  background: url('/images/spinner.gif') no-repeat center;
}
#reaction-iframe-container {
  border-top: 0;
  behavior: url(/stylesheets/iepngfix.htc);
  clear: both;
  display: none;
  position: absolute;
  padding: 10px;
  z-index: 65;
  background: url('/images/reaction_shadow.png');
  width: 450px;
  height: 350px;
  margin-left: -225px;
}

input[type="checkbox"].toggle-button {
  display: none;
  float: right;
}

input[type="checkbox"].toggle-button + label, a.toggle-button {
  font-size: 0.96em;

display: block;

color: #CCC;
  background-color: rgba(0,0,0,0.2);

margin: 5px 12px;
  padding: 3px 4px;

border-radius: 0.4em;
}

input[type="checkbox"].toggle-button:not(.inverted) + label:hover,
input[type="checkbox"].toggle-button.inverted:checked + label:hover
a.toggle-button:hover {
  color: #fdfdfd;
  background-color: #999;
}

input[type="checkbox"].toggle-button:not(.inverted):checked + label,
input[type="checkbox"].toggle-button.inverted:not(:checked) + label {
  color: #555;
  background-color: rgba(255,255,255,0.9);
}

a.toggle-button.logged-out#show-nsfw-toggle {
  background: transparent;
  color: #999 !important;
  margin: 0px;
}

a.toggle-button.logged-out#show-nsfw-toggle:hover {
  color: #fdfdfd !important;
}

#hide-ads-toggle + label {
  margin-left: 0;
}

.post_image .gallery-images .shown-image {
	display: block;
}

.post_image .gallery-images .post_image {
	display: none;
}

.post_image .gallery-images .sel {
	display: block;
}

body.galleries_off .post_image .gallery .gallery-thumbs { display: none; }
body.galleries_off .post_image .gallery-images .post_image { display: block; }

.hide-tags .tags { display: none; }
.hide-tags .admin-edit .tags { display: block; }
.hide-actionbar .actionbar { display: none; }
.hide-repost .actionbar .repost { display: none; }
.hide-reposted-by .reposted_by, .hide-reposted-by .reactions_by { display: none; }

.post_event .dtstart {
  cursor: pointer;
}

.post_event .admin-edit .fieldcontainer,
body.bookmarklet #event .fieldcontainer {
  clear: both;
  overflow: hidden;
}
.post_event .admin-edit .startdate label,
.post_event .admin-edit .fieldcontainer label,
body.bookmarklet #event .startdate label,
body.bookmarklet #event .fieldcontainer label {
  float: left;
  width: 25%;
}
.post_event .admin-edit .fieldcontainer .url,
body.bookmarklet #event .fieldcontainer .url {
  float: left;
  width: 60%;
}

.post_video .embed object {
  display: block;
}
.post_video .body {
  margin-top: .5em;
}

/* ADMIN BUTTONS */

body.toggle-iframe {
  margin: 0;
}

#toggle-iframe {
  width: 0;
  height: 0;
  z-index: 5;
}

#admin-hot,
#toggle-container {
  list-style: none;
  margin: 0; padding: 0;
  z-index: 4;
}

#admin-hot,
#toggle-iframe {
  position: fixed;
  _position: absolute;
  left: 0; bottom: 32px;
}

#toggle-container {
  width: 36px;
}

#admin-hot li,
#toggle-container li {
  margin: 0; padding: 0;
  display: block;
  clear: both;
  zoom: 1; /* IE haslayout */
}

#toggle-container li {
  overflow: hidden;
}

#admin-hot li a,
#toggle-container li a {
  display: block;
  float: left;
  width: 32px;
  margin: 0 0 2px 4px;
  padding: 2px 0 0 0;
  zoom: 1; /* IE haslayout */
  background-color: #ccc;
  color: #000 !important;
  text-decoration: none;
  opacity: .6;
  filter: alpha(opacity=60);
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
}

#toggle-container li a {
  padding: 3px 0;
}
#toggle-container li a img {
  display: block;
}

#toggle-caption {
  position: fixed;
  visibility: hidden;
  font-size: 12px;
  width: 120px;
  text-align: center;
  padding: 0 8px 0 15px;
  line-height: 26px;
  height: 27px;
  overflow: hidden;
  background: url(/images/black50_arr.png);
  -moz-border-radius: .3em;
  -webkit-border-radius: .3em;
  color: #ccc;
  border-radius: .3em;
}

#admin-hot.state_panel #toggle-caption,
#admin.state_new #toggle-caption {
  visibility: hidden !important;
}

#admin-hot li#btn-options a,
#admin-hot li#btn-panel a {
  margin-left: 0;
  -moz-border-radius-topleft: 0;
  -moz-border-radius-bottomleft: 0;
  -webkit-border-top-left-radius: 0;
  -webkit-border-bottom-left-radius: 0;
  width: 36px;
  border-radius-topleft: 0;
  border-radius-bottomleft: 0;
}
#admin-hot li#btn-options a {
  padding: 2px 0 1px 0;
}

#admin ul.group li#btn-membership {
  margin-top: 8px;  
}

#admin-hot li.home a {
  background-position: center;
  display: block;
  height: 24px;
}

#admin-hot li a:hover,
#toggle-container li a:hover {
  color: #fff !important;
  opacity: .9;
  filter: alpha(opacity=90);
}

#toggle-container li a.state-spinner img {
  visibility: hidden;
}

#admin-hot li#btn-new a {
  font-size: 2em;
  line-height: 17px;
  padding: 3px 0;
}

#toggle-container li.sel a,
#toggle-container li.member a,
body.edit li#btn-edit a  {
  opacity: 1;
  filter: alpha(opacity=100);
  background-color: #0e0;
  color: #fff;
}

#toggle-container li#btn-suspicious.sel a {
  background-color: #ff8000;
}

#toggle-container li#btn-hidden.sel a,
#toggle-container li#btn-content-warning.sel a,
#toggle-container li#btn-spammer.sel a,
#toggle-container li#btn-flag.sel a {
  background-color: #e11;
}

#toggle-container li.pending a {
  background-color: #c90;
}

#admin-hot li#btn-options.sel a,
#admin-hot li#btn-panel.sel a {
  background-color: #ddd;
}

#admin-hot #btn-edit a span {
  font-family: 'Times New Roman';
}

/* MESSAGE */

#admin-message {
  position: fixed;
  bottom: 2em;
  right: 2em;
  opacity: 0;
  /*margin: 0 0 0 -40%; -7% 0 0 -40%*/
  padding: 0;
  -moz-border-radius: 1.5em;
  -webkit-border-radius: 1.5em;
  list-style: none;
  border: 1px solid #fff;
  font-size: 18px;
  font-family: Arial, sans-serif;
  padding: .6em 2em;
  color: #fff;
  text-align: center;
  z-index: 998;
  background: url(/images/black50.png);
  border-radius: 1.5em;
}
#admin-message a {
  background: url(/skins/default/white20.png);
  color: #fff;
  text-decoration: none;
  padding: .2em .5em;
  -moz-border-radius: .5em;
  -webkit-border-radius: .5em;
  margin-left: .6em;
  border-radius: .5em;
}
#admin-message a:hover {
  background: url(/skins/default/white40.png);
}
#admin-message tt {
  font-size: .9em;
  margin-right: .3em;
}
#admin-message.progress, #admin-message.info {
  background-color: #C90;
}
#admin-message.progress a, #admin-message.info a {
  background-color: #960;
}
#admin-message.warning {
  background-color: #A00;
}
#admin-message.warning a { 
  background-color: #c44;  
}
#admin-message.invitation {
  background-color: #0A0;
}
#admin-message.invitation a { 
  background-color: #4A4;  
}

/* LIGHTBOX */

#lightbox-bg{
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;  
  background-repeat: no-repeat;
  background-position: center;
}

#lightbox {
  display: none;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;  
  background-repeat: no-repeat;
  background-position: center;
}
#lightbox-bg {
  opacity: .8;
  filter: alpha(opacity=80);  
  background: #000 ;
  z-index: 100;
  cursor: pointer;
  cursor: -moz-zoom-out;
  cursor: -webkit-zoom-out;  
}
#lightbox {
  z-index: 101;
  cursor: pointer;
  cursor: -moz-zoom-out;
  cursor: -webkit-zoom-out;  
}
a.lightbox {
  cursor: -moz-zoom-in;  
  cursor: -webkit-zoom-in;  
  /*cursor: url('/images/cursors/zoomin.cur');
  cursor: row-resize;*/
}

/* SOUP BADGE */

#soup {
  position: absolute;
  right: 3em;
  top: -5px;
  z-index: 80;
}
#soup a {
  display: block;
}
#soup img {
  behavior: url(/stylesheets/iepngfix.htc);
}

/* BUBBLE */

#bubble {
  display: none;
  position: absolute;
  width: 250px;
  margin-top: 0;
  font-size: .8em;
  opacity: .95;
  filter: alpha(opacity=95);
  z-index: 99;
}
#bubble #bubblebit {
  background-image: url('/images/bubblebit.gif');
  background-repeat: no-repeat;
  background-position: 130px 0;
  height: 6px;
  font-size: 1px;
}
#bubble #bubblepost {
  background: #000;
  padding: .5em;
  color: #fff;
}
#bubble #bubblepost a {
  color: #fff;  
}
#bubble #bubblepost .post {
  margin: 0;
}
#bubble #bubblepost blockquote {
  margin: 0;
}
#bubble #bubblepost blockquote .quote {
  float: left;
}

#bubble #bubblepost .attribution {
  padding-top: .3em;
  text-align: right;
  font-size: .85em;
  color: #666;
}
#bubble.post #bubblepost .attribution {
  clear: both;
}
#bubble #bubblepost .attribution a {
  color: #999;
  font-weight: bold;
  text-decoration: none;
  margin-right: .3em;
}
#bubble #bubblepost .attribution a:hover {
  text-decoration: underline;
}
#bubble #bubblepost form {
  margin: 0;
  clear: both;
}

#bubble .post_image .imagecontainer {
  width: auto !important;
  height: auto !important;  
}

#bubble .post_video embed,
#bubble .post_video object /*#bubble .post_video * */ {
  display: none;  
}
#bubble .post_video {
  background: transparent url(/images/icon_video.png) top center no-repeat;  
  behavior: url(/stylesheets/iepngfix.htc);
  width: 100%;
  padding-top: 32px;
}

#bubble.wide {
  width: 400px;
}
#bubble.wide .post_image img {
  display: none;
}

#bubble.user {
  font-size: 12px !important;
  font-family: Arial, Helvetica, sans-serif !important;
  width: 180px;
}
#bubble.user #bubblepost {
  padding: .3em .5em .5em .5em;
}
#bubble.user h4 {
  font-size: 1.3em;
  margin: 0;
  padding-bottom: .2em;
  float: left;
}
#bubble.user h4 a {
  text-decoration: none;
}
#bubble.user ul.actions,
#bubble.user ul.actions li {
  margin: 0; padding: 0;
  list-style: none;
}
#bubble.user ul.actions {
  overflow: hidden;
  clear: both;
  padding-top: .2em;
}
#bubble.user ul.actions li {
  float: left;
  width: 49.5%;
  margin-right: 1%;
}
#bubble.user ul.actions li.ignore {
  margin-right: 0;
}
#bubble.user ul.actions li.flag {
  width: 100%;
  margin: 5px 0 0 0;
}
#bubble.user ul.actions li a {
  display: block;
  text-decoration: none;
}
#bubble.user ul.actions li a span {
  margin: 1px 5px 0 1px;
  display: block;
  float: left;
  width: 10px;
  height: 10px;
  border: 1px solid #444;
  background-position: 1px 1px;
  background-repeat: no-repeat;
}
#bubble.user ul.actions li.true a span {
  background-image: url('/images/check.gif');
}
#bubble.user ul.actions li a:hover span {
  background-image: url('/images/check0.gif');
}

#bubble.user #bubblepost form p {
  margin: .3em 0 0 0;
}
#bubble.user #bubblepost .attribution {
  padding-top: .4em;
  margin-right: .3em;
}
#bubble.user #bubblepost .group {
  color: #999;
  clear: both;
  margin-top: .5em;
}
#bubble.user #bubblepost .group a {
  color: #999;
}

#bubble .xhr-container {
  clear: both;
  color: #999;
}

.latestpost {
  display: none;
}

/* ENDLESS SCROLLING */

.endlessnotice {
  display: none;
}

#endless_error.endlessnotice,
#load_more.endlessnotice,
#reload_notice.endlessnotice,
#top_notice.endlessnotice {
  margin-bottom: 2em;  
}

#more_loading.endlessnotice {
  background: url(/images/spinner.gif) 0px 3px no-repeat;
  margin-bottom: 4em;
}

#more_loading.endlessnotice,
#load_more.endlessnotice,
#reload_notice.endlessnotice,
#top_notice.endlessnotice {
  padding-left: 26px;
}

#reload_notice.endlessnotice {
  background: url(/images/spinner.gif) 0px 3px no-repeat;
}

#endless_error.endlessnotice {
  background-color: #fcc;
  color: #855;
  padding: .5em 1em;
  -moz-border-radius: .5em;
  border-radius: .5em;
}
#endless_error.endlessnotice strong {
  color: #000;
}

.state-spinner {
  background-image: url('/images/spinner.gif') !important;
  background-position: center !important;
  background-repeat: no-repeat !important;  
}
/* admin+storefront */

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

ul.userlist li {
  margin: 0 0 1px 0;
  padding: 0;
  clear: both;
  height: 24px;
  position: relative;
}

ul.userlist_grid li {
  float: right;
  clear: none;
  margin-left: 1px;  
}

ul.userlist li a.avatarlink {
  display: block;
  text-align: left;
  line-height: 2em;
  margin-left: 0;
}

ul.userlist li.over {
  background-color: #ddd;
}

ul.userlist li a.avatarlink img {
  float: left;  
  margin: 0 .5em 0 0;
  top: 0;
}

ul.userlist li div.mutual {
  float: left;
  width: 15px;
  line-height: 2em;
  background: url('/images/mutual.gif') center no-repeat;
  margin-left: .3em;
  opacity: .3;
  filter: alpha(opacity=30);
  behavior: url(/stylesheets/iepngfix.htc);
  position: absolute;
  left: 0;
  z-index: 1;
}

ul.userlist li input.btn {
  visibility: hidden;
  float: left;
  font-size: 1.1em !important;
  text-decoration: none;
  margin: .2em 0 0 .2em;
  padding: 0 .2em;
  -moz-border-radius: .3em;
  -webkit-border-radius: .3em;
  color: #888;
  background-color: #eee;
  border: 0;
  position: absolute;
  right: .2em;
  left: auto;
  cursor: pointer;
  z-index: 2;
}

ul.userlist li input.btn:hover {
  background-color: #fff;
}

ul.userlist li.over input.btn {
  visibility: visible;
}

#admin-panel ul.userlist li a.avatarlink img {
  padding: 4px 0 0 2px;
}

.switchable .switchable2 {
  display: none; 
}
.switchable_switched .switchable1 {
  display: none;
}
.switchable_switched .switchable2 {
  display: block;
}
#admin-panel .switchable1 a.admin-button,
#admin-panel .switchable2 a.admin-button {  
  font-size: .9em;
  float: right;
  margin-top: 1.2em;
}

/* BAR */

#bar ol.notifications {
  margin: 0; padding: 0;
  list-style: none;
}

#bar ul#menu li.notifications ol.dropdown_body a,
#bar ul#menu li.notifications .dropdown_head a {
  padding: 0; 
  display: inline; 
}
#bar ul#menu li.notifications ol.dropdown_body img,
#bar ul#menu li.notifications .dropdown_head a img {
  position: static;
  vertical-align: text-bottom;
  margin-right: 0;
}

#bar ol.notifications li {
  float: none;
  padding: .1em 0;
  margin: 0;
  line-height: 1.5em;
  overflow: hidden;
}

#bar ol.notifications li.end {
  border-top: 1px dotted #333;
  margin-top: .5em;
  padding-top: .5em;
}

#bar ul li.notifications a:hover {
  border-color: #fff;
}

#bar ol.notifications li.end a.rss {
  float: right;
  opacity: .5;
  border-bottom: 0 !important;
}
#bar ol.notifications li.end a.rss:hover {
  opacity: 1;
}

#bar ol.notifications li.end a img {
  behavior: url(/stylesheets/iepngfix.htc);
}

#bar ol.notifications li.end a,
#bar ul li .dropdown_body .sub .sub_head {
  font-size: .9em;
  text-transform: uppercase; 
  color: #333;
}

#bar ul li .dropdown_body .sub {
  padding-bottom: 3px;
  margin-top: 3px;
  margin-bottom: 3px;
  border-bottom: 1px solid #333; 
}

#bar ul li .dropdown_body .sub .sub_head {
  padding: 5px 13px 2px 13px;
}

#bar ol.notifications li h2 {
  font-weight: normal;
}

#bar ol.notifications li .quote {
  display: none;
}

#bar ol.notifications li .date {
  margin: .6em 0 0 0;
  color: #666;
  font-size: .9em;
}

#bar ol.notifications li .time {
  color: #666;
  margin-right: .5em;
  font-size: .9em;
}

#bar ul li.notifications .user_container,
#bar ul li.notifications .user_container a {
  display: inline;
  font-weight: bold;
}
#bar ul li.notifications .user_container a {
  padding: .2em;
}
#bar ul li.notifications .user_container a:hover {
  background-color: #222;
  color: #000;
}

#bar ol.notifications li .post {
  padding: .8em;
  font-size: .9em;
  line-height: 1.3em;
  margin-bottom: .5em;
  margin-left: 3.65em;
  border-left: .5em solid #c0d0e0;
  overflow: hidden;
}

#bar, #barfade, #barbg {
  position: fixed;
  _position: absolute; /* ie6 */
  width: 100%;
  height: 32px;    
}

#bar {
  font-size: 1.14em;
  z-index: 89;
  opacity: .9;
  background: #333;
  color: #999;
}

#barfade {
  z-index: 87;
  background: transparent url('/images/bar/fadeout.png');
}

#barbg {
  position: absolute;
  background: transparent url('/images/bar/fadeblack.png');
  z-index: 88;
}

#bar ul { 
  list-style: none;
  margin: 0; padding: 0;
  overflow: hidden;
  float: left;
  height: 32px;
  width: 100%;
}
body.frontpage #bar ul {
  width: auto;
}
#bar ul li {
  margin: 0; padding: 0;
  float: left;
}

#bar ul li.notifications {
  float: right;
  margin-right: 5px;
  width: 450px;
}
#bar ul li.tryinfo {
  position: absolute;
  right: 0;
  width: 36em;
  height: 32px;
  margin-right: 4.1em;
  background: #000;
}
#bar ul li.notifications .dropdown_head {
  padding: 4px 20px 12px 20px;
  font-size: .9em;
  line-height: 2em;
}
#bar ul li.notifications .dropdown_head .time {
  font-size: .9em;
  color: #666;
  float: left;
  margin-right: 1em;
  padding-top: .1em;
}
#bar ul li.notifications .dropdown_head a,
#bar ul li .text a {
  display: inline;
  padding: 0;
}
#bar ul li.notifications .dropdown_body {
  font-size: .9em;
  width: 410px;
  padding: 8px 20px;
  overflow: hidden;
}
#bar ul li.tryinfo .dropdown_body {
  width: 36em;
  padding: 0;
  overflow: hidden;
}
#bar ul li.tryinfo div.text {
  overflow: auto;
}
#bar ul li.tryinfo div.over a.signup {
  display: none;
}
#bar ul li.tryinfo div div.signup {
  display: none;
}
#bar ul li.tryinfo div.over div.signup {
  display: block;
  font-weight: bold;
  color: #FFEBC1;
  float: left;
}
#bar ul li.tryinfo div a.cancel {
  display: none;
}
#bar ul li.tryinfo div.over a.cancel {
  display: block;
  float: right;
  font-weight: normal;
  font-size: .9em;
}
#bar ul li.tryinfo div.over span.info {
  display: none;
}

#bar ul li a {
  display: block;
}
#bar ul li a.tv {
  float: right;
}

#bar ul#menu li.soup {
  margin-right: 5px;  
  float: right;
}
body.frontpage #bar ul#menu {
  padding-left: 175px;
}
#bar ul#menu li a, #bar ul#menu li .text {
  color: #999;
  padding: 8px 14px;
}
#bar ul#menu li.tryinfo .text {
  color: #AA9988;
  padding: 8px 1em;
}
#bar ul#menu li.tryinfo .text a {
  color: #FFEBC1;
  padding: 0;
  text-decoration: underline !important;
}

#bar ul#menu li .dropdown_body {
  overflow-y: auto;  
}

#bar ul#menu li .dropdown_body a {
  padding-top: 6px;
  padding-bottom: 6px;
}
#bar ul#menu li.people .dropdown_body a {
  padding-right: 3.3em;
}

#bar ul#menu li .dropdown_body a.tv {
  padding: 5px 13px 7px 5px;
}

#bar ul#menu li .dropdown_body a.tv span,
.post a.tv_promo {
  color: #777;
  background: #222;
  padding: 2px 5px;
  border-radius: .5em;
  -moz-border-radius: .5em;
  -webkit-border-radius: .5em;
  font-size: .6em;
}
#bar ul#menu li .dropdown_body a.tv:hover span {
	color: #000;
	background: #fff;
}
.post a.tv_promo {
  float: right; 
  color: #999 !important;
  background: #000 url('/images/tvicon.gif') 7px 1px no-repeat;
  text-decoration: none;
  -moz-border-radius-topleft: 0;
  -moz-border-radius-topright: 0;
  -webkit-border-top-left-radius: 0;
  -webkit-border-top-right-radius: 0;
  line-height: 1.7em;
  margin-left: 1em;
  padding: 0 .8em 0 25px;
  font-size: 11px;
  border-radius-topleft: 0;
  border-radius-topright: 0;
}
.post a.tv_promo:hover {
  background-color: #333;
  color: #fff !important;
}

#bar ul#menu li .dropdown_body a.btn {
  padding: 3px 20px;
  text-align: center;
}
#bar ul#menu li.soup a {
  padding: 8px 13px;
}
#bar ul#menu li.soup .dropdown_body a {
  padding: 5px 13px;
}
#bar ul#menu li.soup a.dropdown_head {
  padding-right: 17px !important;
}
#bar ul#menu li a img {
  vertical-align: bottom;
  margin-right: 5px;
}
#bar ul#menu li div.dropdown_body a img {
  vertical-align: inherit;
}
#bar ul#menu a {
  text-decoration: none;  
}
#bar ul#menu a:hover {
  text-decoration: underline;
}
#bar ul#menu .notifications a {
  border-bottom: 1px solid #333;  
}
#bar .content {
  position: relative;
}
#bar ul#util .login a:hover {
  text-decoration: underline;
}
body.loggedin #bar ul#menu li a,
#bar ul#menu li.sel a {
  margin-top: 0;
  font-size: 1em;
}
#bar ul#menu li.sel a {
  background: #44c1d9;
  color: #000;
}
#bar ul#menu li.sel a:hover {
  text-decoration: none;
}

#bar ul#util { 
  float: right;
}
#bar ul#util li a,
#bar ul#util li a {
  color: #666;
  text-decoration: none;
  padding: 8px 15px;
}
#bar a.dropdown_head {
  background-image: url('/images/bar/drop.gif');
  background-repeat: no-repeat;
  background-position: 89% 15px;
  padding-right: 25px !important;
}
#bar ul li.login a.dropdown_head {
  background-image: none;
}
#bar ul li.soup a.dropdown_head {
  background-position: 35px 15px;
}
#bar ul li.notifications a.dropdown_head {
  background-position: 98% 15px;
}

#bar ul li.over .dropdown_head,
#bar ul li.over a.dropdown_head {
  background-color: #000;
}
#bar ul li.people .dropdown_body div:hover a.tv { color: #999 !important }
#bar ul li.over a.dropdown_head,
#bar ul li a:hover,
#bar ul li.people .dropdown_body div:hover a,
#bar ul li.people .dropdown_body div:hover a.tv:hover {
  color: #fff !important;
}

body.loggedin #bar ul li.over a.dropdown_head,
body.loggedin #bar ul li a:hover {
  text-decoration: none !important;
}

.dropdown .dropdown_body {
  display: none;
  background: #000;
  position: absolute;
  top: 2.2em;
  padding-bottom: .4em;
  z-index: 99;
  color: #999;
}

body.frontpage #bar ul li.over a.dropdown_head,
body.frontpage .dropdown .dropdown_body {
  background-color: #333;
}

.over .dropdown_body {
  display: block !important;
}

#bar ul li.soup .dropdown_body {
  width: 130px;
  margin-left: -79px;
}
 
#bar ul#util li.login { width: 65px; }
#bar ul#util li.language .dropdown_body {
  right: 65px;  
  width: 120px;
}
#bar ul#util li.login .dropdown_body {
  right: 0;
  width: 320px; 
}
#bar ul#util li.language .dropdown_body a {
  display: block;
  margin: 0;
  padding: .2em 30px .2em 12px;
  width: 78px;
  text-align: right;
  color: #999;
}
#bar ul .es a.es,
#bar ul .cs a.cs,
#bar ul .it a.it,
#bar ul .eo a.eo,
#bar ul .pl a.pl,
#bar ul .pt a.pt,
#bar ul .fr a.fr,
#bar ul .de a.de,
#bar ul .en a.en {
  background-image: url('/images/check.gif');
  background-position: 96px 6px;
  background-repeat: no-repeat;
}

#bar ul#util li.login .dropdown_body {
  padding: 1em;
}
#bar ul#util li.login .dropdown_body label {
  overflow: hidden;
  clear: both;
}
#bar ul#util li.login .dropdown_body label span {
  display: block;
  float: left;
  width: 6em;
  color: #aaa;
  padding-top: 5px;
}
#bar ul#util li.login .dropdown_body label input {
  width: 224px;
  font-size: 1.2em;
  border: 0;
  padding: 3px;
  margin-bottom: 2px;
}
input.loginbutton, input.cancelbutton,
.logging-in {
  padding: .2em 16px .2em 32px;
  margin: .2em 0 0 0;
}
input.loginbutton {
  float: left;
  font-size: 16px !important;
  border: 0;
  background: #fc6 url(/images/storefront/padlock.gif) 11px no-repeat;
  color: #660;
  -moz-border-radius: .9em;
  -webkit-border-radius: .9em;
  cursor: pointer;
  line-height: 1.45em;
  border-radius: .9em;
}
input.cancelbutton {
  float: left;
  font-size: 16px !important;
  border: 0;
  background: #D9534F;
  color: #FFFFFF;
  -moz-border-radius: .9em;
  -webkit-border-radius: .9em;
  cursor: pointer;
  line-height: 1.45em;
  margin-left: 1em;
  border-radius: .9em;
}
.logging-in {
  font-style: italic;
  padding-left: 24px;
  background: url('/images/spinner.gif') no-repeat left;
  display: none;
}
#bar ul#util li.login .dropdown_body input.loginbutton {
  font-size: 14px !important;
  margin-left: 6em;
}

#bar ul#util li.login p {
  margin: 0;
}
a.login_forgot {
  float: left;
  padding: .7em 0 0 1em;
  font-size: .9em;
  text-decoration: underline !important;
}
#bar ul#util li a.login_forgot {
  font-size: .8em;
  padding: .7em 0 0 .6em;
}
#bar a.login_forgot:hover {
  color: #ccc;
}

#bar a.btn {
  display: block !important;
  margin-top: .4em;
  -moz-border-radius: .5em;
  -webkit-border-radius: .5em;
  background: #444;
  color: #ccc;
  border-radius: .5em;
}
#bar a.btn:hover {
  background: #666;
  color: #fff;
}

#bar {
  font-family: 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Arial, sans-serif;
	font-size: 14px;
	left: 0;
	top: 0;
}

#barbg, #barfade {
	left: 0;
	top: 0;
}

body.loggedin {
	margin-top: 32px;
}

body.loggedin #soup {
	top: 27px;
}

body.loggedin #admin .panelcontainer2 {
	margin-top: 10px;
}

/* TUTORIAL */

body.tutorial_active #barcontainer {
  display: none;
}
body.tutorial_active {
  margin-top: 0 !important;
}
body.tutorial_active #admin {
  top: 0px;
}
body.tutorial_active #soup {
  top: -5px !important;
}

.shadedbox {
  position: fixed;
  font-size: 12px;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  opacity: 0;
  /*filter:alpha(opacity=0);*/
  z-index: 99;
  bottom: 60px; /* default size & pos are for tutorial */
  right: 60px;
  width: 270px;  
}

.shadedbox p,
body.login-iframe p {
  margin: .5em 0;
}

.shadedbox .shadow,
.shadedbox .box {
  -moz-border-radius: 1em;
  -webkit-border-radius: 1em;
  border-radius: 1em;
}

.shadedbox .shadow {
  position: absolute;
  left: 0px; top: 0px;
  width: 228px;
  padding: 21px;
  background: #000;
  opacity: .3;
  z-index: 100;
  -moz-border-radius: 1.5em;
  -webkit-border-radius: 1.5em;
  filter: alpha(opacity=30);
  border-radius: 1.5em;
}

.shadedbox .box {
  position: relative;
  left: 6px; top: 6px;
  width: 228px;
  padding: 15px;
  background: #fff;
  color: #000;
  z-index: 102;
  filter:alpha(opacity=100);
}

.shadedbox .arrow {
  display: none;
  position: absolute;
  z-index: 101;
  background: url(/images/tutorial/arr_bottom.png) left top no-repeat;
  width: 12px;
  height: 14px;
}

.shadedbox .character {
  display: none;
  position: absolute;
  top: -9px;
  left: 19px;
  z-index: 102;
  background: url(/images/tutorial/monster_hello.png) left top no-repeat;
  width: 137px;
  height: 150px;
}

#tutorial.step0 {
  left: 50%;
  top: 50%;
  bottom: auto; right: auto;
  width: 448px;
  margin-left: -225px;
  margin-top: -120px;
}
#tutorial.step0 .shadow {
  width: 280px;
  padding: 20px 10px 27px 160px;
}
#tutorial.step0 .box {
  width: 268px;
  padding: 20px 10px 15px 160px;
}
#tutorial.step0 .character {
  display: block;
}

#tutorial.initialimport {
  left: 50%;
  top: 50%;
  bottom: auto; right: auto;
  width: 528px;
  margin-left: -265px;
  margin-top: -150px;
}
#tutorial.initialimport .shadow {
  width: 338px;
  padding: 26px 26px 21px 166px;
}
#tutorial.initialimport .box {
  width: 338px;
  padding: 20px 20px 15px 160px;
}

.shadedbox h3 {
  color: #c60404;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1.8em;
  letter-spacing: -.02em;
}

.shadedbox .btns {
  margin-top: 1.7em;
  overflow: hidden;
}
.shadedbox a.btn, a.pillbtn {
  display: block;
  float: left;
  -moz-border-radius: 1em;
  -webkit-border-radius: .9em;
  padding: .4em 1em;
  text-decoration: none;
  background-color: #ddd;
  color: #666;
  border-radius: 1em;
}
.shadedbox a.btn:hover, a.pillbtn:hover {
  background-color: #bbb;
  color: #000;
}
.shadedbox a.btn {
  color: #fff !important;
  background-color: #c60404;
}
.shadedbox a.btn:hover {
  background-color: #a50404; 
}
.shadedbox a.skip {
  margin-left: .5em;
  background-color: #999;
}
.shadedbox a.skip:hover {
  background-color: #666;
}
.shadedbox a.next {
  color: #777;
  float: right;
  padding-top: .5em;
}

#tutorial p.bmlet {
  padding-top: .5em;
  margin-bottom: 0;
}

.shadedbox .close {
  position: absolute;
  display: block;
  right: 0;
  top: 0;
  z-index: 103;
  text-decoration: none;
  font-size: 1.3em;
  margin-right: 15px;
  margin-top: 10px;
  color: #d0d0d0;
}
.shadedbox .close:hover {
  color: #999;  
}

#tutorial.step1,
#tutorial.step2,
#tutorial.step4,
#tutorial.step6,
#tutorial.step7,
#tutorial.step8 {
  width: 450px;
}
#tutorial.step1 .box, /* wtf, ie8?! */
#tutorial.step1 .shadow,
#tutorial.step2 .box,
#tutorial.step2 .shadow,
#tutorial.step4 .box,
#tutorial.step4 .shadow,
#tutorial.step6 .box,
#tutorial.step6 .shadow,
#tutorial.step7 .box,
#tutorial.step7 .shadow,
#tutorial.step8 .box,
#tutorial.step8 .shadow {
  width: 408px;
}

#tutorial.step0 .close {
  display: none;
}

#tutorial.step1 .arrow {
  display: block;
  bottom: -20px;
  left: 20px;
}

#tutorial.step1 {
  left: 0px;
  bottom: 132px;
  right: auto;
}

/* 2 content types */
#tutorial.step2 {
  left: 40px;
  bottom: 120px;
}

/* 4-5 edit mode */
#tutorial.step4,
#tutorial.step5 {
  left: 45px;
  bottom: 51px;
}
#tutorial.step4 .arrow,
#tutorial.step5 .arrow {
  display: block;
  bottom: 10px;
  left: -6px;
  background: url(/images/tutorial/arr_left.png) left top no-repeat;
}

body.tutorial_step5 #header #descriptioncontainer iframe {
  border-color: #c60404;
}
body.tutorial_step5 #header #descriptioncontainer input.submit {
  background-color: #c60404;
}

/* 6-7 bookmarklet */
#tutorial.step6, #tutorial.step7 {
  left: 20px;
  top: 5px;
}
/*#tutorial.step6 .arrow, #tutorial.step7 .arrow {
  display: block;
  top: -6px;
  left: 20px;
  background: url(/images/tutorial/arr_top.png) left top no-repeat;
}*/

/* 8-9 customization */
#tutorial.step8 {
  left: 45px;
  bottom: 22px;
}
#tutorial.step8 .arrow {
  display: block;
  top: 22px;
  left: -6px;
  background: url(/images/tutorial/arr_left.png) left top no-repeat;
}

#tutorial.step9 {
  top: 10px;
  bottom: auto;
  left: 10px;
}
#tutorial.step9 .arrow {
  display: block;
  bottom: -20px;
  left: 22px;
}
body.tutorial_step9 #admin-panel {
  padding-top: 40px;
}

/* 10 end */
#tutorial.step10 {
  top: 40px;
  right: 90px;
  bottom: auto;
}
#tutorial.step10 .box {
  padding-bottom: 5px;
}
#tutorial.step10 .shadow {
  padding-bottom: 11px;
}
#tutorial.step10 .arrow {
  display: block;
  top: -6px;
  right: 20px;
  background: url(/images/tutorial/arr_top.png) left top no-repeat;
}
#tutorial.step10 .close {
  display: none;
}
#tutorial.step10 .character {
  display: block;
  right: 6px;
  bottom: -6px;
  left: auto;
  top: auto;
  z-index: 102;
  background: url(/images/tutorial/monster_bye.png) left top no-repeat;
  width: 104px;
  height: 119px;
}
#tutorial.step10 a.next {
  float: none;
  display: block;
  clear: left;
  color: #999;
  font-size: .95em;
  padding-top: 1em;
}

#loginortry .shadedbox {
  font-size: 15px;
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.4em;
  opacity: 1;
  width: 670px;
  left: 50%;
  top: 50%;
  margin-left: -330px;
  margin-top: -180px;
  right: auto;
  bottom: auto;
}
#loginortry .shadedbox_div {
  width: 598px;
  height: 260px;
  padding: 25px;
  padding-top: 5px;
}
#loginortry .shadow {
  width: 610px;
  height: 272px;
}
#loginortry .reaction_tutorial .shadow {
  height: 332px;
}
#loginortry .reaction_tutorial .box {
  height: 320px;
}
#loginortry .reaction_tutorial .login-container {
  height: 170px;
}
#loginortry .box {
  background-image: url('/images/soup_badge.png');
  background-position: 580px -5px;
  background-repeat: no-repeat;
}

#login-iframe {
  width: 0;
  height: 0;
}
body.login-iframe {
  font-size: 15px;
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.4em;
  margin: 0;
  background-color: #fff;
}
body.login-iframe .loginform {
  font-size: .8em;
  color: #777;
  line-height: 1.2em;
  width: 186px;
}
#loginortry .login-container {
  float: right;
  margin-left: 1.5em;
  border-left: 1px dotted #ddd;
  padding-left: 1.5em;
  width: 31%;
  height: 150px;
  background: url('/images/spinner.gif') no-repeat center;
}
body.login-iframe .loginform  h4 {
  font-size: 1.3em;
  letter-spacing: -.02em;
  margin-top: 0;
  margin-bottom: .5em;
}
body.login-iframe .loginform p {
  padding: 0;
}
body.login-iframe .loginform input.loginbutton,
body.login-iframe .loginform .logging-in {
  color: #777;
}
body.login-iframe .loginform input.loginbutton {
  background-color: #ddd;
  font-size: 12px !important;
}
body.login-iframe .loginform a.login_forgot {
  display: none;
  font-size: .8em;
  color: #777;
  padding-left: .5em;
}
body.login-iframe .error {
  color: #CC0000;
}
body.login-iframe .submitted .loginbutton {
  display: none;
}
body.login-iframe .submitted .logging-in {
  display: block;
}

#loginortry h3 {
  background: url(/images/tutorial/monster_cut.png) bottom left no-repeat;
  padding-left: 60px;
  padding: 1.2em 0 .5em 100px;
  border-bottom: 1px solid #ddd;
  margin-top: 0;
  margin-bottom: 1em;
  color: #000; /*39F*/
  overflow: hidden;
  font-size: 1.5em;
}

#loginortry p {
  padding: 0 0 .6em 0;
}
#loginortry .trypromo {
  padding-bottom: 2em;
}
#loginortry .trypromo .pillbtn {
  background-color: #fc6; /*c60404;*/
  color: #660 /*fff*/;
}
#loginortry .trypromo .or {
  float: left;
  font-size: .85em;
  color: #888;
  padding: .5em 0 0 1em; 
}
#loginortry .trypromo .or a {
  color: inherit;
  padding-left: .5em;
}
#loginortry .quicksignup .explanation {
  margin: -.4em 0 0 0;
}
#loginortry .quicksignup form p {
  margin: 0;
  padding: 0 0 1px 0;
}
#loginortry .quicksignup form label {
  float: left;
  clear: left;
  width: 6em;
  padding-top: .1em;
}
#loginortry .quicksignup form input {
  width: 13em;
  font-size: .9em;
}
#loginortry .quicksignup form input.submit {
  width: auto;
  padding: .2em 16px .2em 16px;
  margin: .2em 0 0 5.5em;
  float: left;
  font-size: 1.1em;
  border: 0;
  background: #fc6;
  color: #660;
  -moz-border-radius: .9em;
  -webkit-border-radius: .9em;
  cursor: pointer;
  line-height: 1.45em;
  border-radius: .9em;
}
#loginortry .quicksignup .nothanks {
  color: #888;
  margin-left: 9em;
  font-size: .9em;
  margin-top: .6em;
  position: absolute;
}

/* BASIC TOGGLING FUNCTIONS */
.toggle .toggle1 { display: block; }
.toggle .toggle2 { display: none; }
.state-toggled .toggle1 { display: none; }
.state-toggled .toggle2 { display: block; }

/* Hide horrible AddThis flash embed */
object#atff { display: none; }

div#descriptioncontainer * {
  z-index: 0 !important;
}

/* Ad related stuff for user soups */

#adlayoutcontainer {
  width: 100%;
  margin: 0 auto;
}

#rightfold {
  height:100%;
  margin-right: 0px;
  overflow: hidden !important; /* FF Scroll-leiste */
}

#unspeakablecontainer {
  /*padding-top:10px;*/
  height:100%;
  float: right;
  width: 0px;
  margin-left: 0px;
  /*background-color: #98fb98 !important;*/
  /*color: #ffffff;*/
  overflow: hidden !important; /* FF Scroll-leiste */
}

@media all and (min-device-width: 1200px) {
  body.showads #rightfold {
    height:100%;
    margin-right: 304px;
    overflow: hidden !important; /* FF Scroll-leiste */
  }
  body.showads #unspeakablecontainer {
    width: 304px;
    margin-left: -305px;
  }

body.showads #soup {
    right: 350px;
  }

body.showads #placement {
    right: 0px;
    width: 304px;
    height: 100%;
    position: fixed;
    background-color: #1e1e1e;
    top: 0px;
  }

body.showads.loggedin #placement {
    top: 32px;
  }

body.showads #soupbanner {
    margin-top: 2px;
    margin-left: 2px;
    margin-right: 2px;
  }

body.showads .banner {
    margin-bottom: 2px;
  }

body.showads .banner img{
    border: 0;
  }
}

#wrapleft {
  height:100%;
  float: left;
  width: 100%;
  /*background-color: #cfcfcf;*/
}

/* PAYUP INTERSTITIAL */

#payuptint.inactive, #payupinterstitial.inactive {
  display:none;
}

#payuptint {
  position:fixed;
  top:0;
  left:0;
  background:rgba(0,0,0,0.6);
  z-index:5;
  width:100%;
  height:100%;
  /*display:none;*/
}

#payupinterstitial {
  animation : none;
  animation-delay : 0;
  animation-direction : normal;
  animation-duration : 0;
  animation-fill-mode : none;
  animation-iteration-count : 1;
  animation-name : none;
  animation-play-state : running;
  animation-timing-function : ease;
  backface-visibility : visible;
  background : 0;
  background-attachment : scroll;
  background-clip : border-box;
  background-image : none;
  background-origin : padding-box;
  background-position : 0 0;
  background-position-x : 0;
  background-position-y : 0;
  background-repeat : repeat;
  background-size : auto auto;
  border-style : none;
  border-width : medium;
  border-color : inherit;
  border-bottom : 0;
  border-bottom-color : inherit;
  border-bottom-left-radius : 0;
  border-bottom-right-radius : 0;
  border-bottom-style : none;
  border-bottom-width : medium;
  border-collapse : separate;
  border-image : none;
  border-left : 0;
  border-left-color : inherit;
  border-left-style : none;
  border-left-width : medium;
  border-radius : 0;
  border-right : 0;
  border-right-color : inherit;
  border-right-style : none;
  border-right-width : medium;
  border-spacing : 0;
  border-top : 0;
  border-top-color : inherit;
  border-top-left-radius : 0;
  border-top-right-radius : 0;
  border-top-style : none;
  border-top-width : medium;
  bottom : auto;
  box-shadow : none;
  box-sizing : content-box;
  caption-side : top;
  clear : none;
  clip : auto;
  color : inherit;
  columns : auto;
  column-count : auto;
  column-fill : balance;
  column-gap : normal;
  column-rule : medium none currentColor;
  column-rule-color : currentColor;
  column-rule-style : none;
  column-rule-width : none;
  column-span : 1;
  column-width : auto;
  content : normal;
  counter-increment : none;
  counter-reset : none;
  cursor : auto;
  direction : ltr;
  display : inline;
  empty-cells : show;
  float : none;
  font : normal;
  font-size : medium;
  font-style : normal;
  font-variant : normal;
  font-weight : normal;
  hyphens : none;
  letter-spacing : normal;
  line-height : normal;
  list-style : none;
  list-style-image : none;
  list-style-position : outside;
  list-style-type : disc;
  margin-bottom : 0;
  margin-right : 0;
  max-height : none;
  max-width : none;
  min-height : 0;
  min-width : 0;
  opacity : 1;
  orphans : 0;
  outline : 0;
  outline-color : invert;
  outline-style : none;
  outline-width : medium;
  overflow : visible;
  overflow-x : visible;
  overflow-y : visible;
  padding : 0;
  padding-bottom : 0;
  padding-left : 0;
  padding-right : 0;
  padding-top : 0;
  page-break-after : auto;
  page-break-before : auto;
  page-break-inside : auto;
  perspective : none;
  perspective-origin : 50% 50%;
  /* May need to alter quotes for different locales (e.g fr) */
  quotes : '\201C' '\201D' '\2018' '\2019';
  right : auto;
  tab-size : 8;
  table-layout : auto;
  text-align : inherit;
  text-align-last : auto;
  text-decoration : none;
  text-decoration-color : inherit;
  text-decoration-line : none;
  text-decoration-style : solid;
  text-indent : 0;
  text-shadow : none;
  text-transform : none;
  transform : none;
  transform-style : flat;
  transition : none;
  transition-delay : 0s;
  transition-duration : 0s;
  transition-property : none;
  transition-timing-function : ease;
  unicode-bidi : normal;
  vertical-align : baseline;
  visibility : visible;
  white-space : normal;
  widows : 0;
  word-spacing : normal;

font-family: 'Open Sans', Opensans, 'Liberation Sans', 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Arial, sans-serif, sans;
  height:480px;
  width:710px;
  left: 50%;
  top: 50%;
  margin:0 auto;
  margin-top:-240px;
  margin-left:-355px;
  position:fixed;
  z-index:100;
  /*display:none;*/
  border:0px;
  background-color: #f2f2f2;
}

#payupinterstitial #titlebar {
  background-color:#303030;
  margin:auto;
  height:60px;
  width:100%;
}

#payupinterstitial #titlebar h2#title {  
  margin-top:0px;
  padding-top:0px;
  font-family: 'Open Sans', 'Opensans', 'Liberation Sans', 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Arial, sans-serif, sans;
  font-weight: 600;
  font-size: 20px;
  line-height:20px;
  text-transform: uppercase;
  color:#f2f2f2;
  line-height: 60px;
  padding-left:20px;
}

#payupinterstitial #soupup {
  font-family: 'Open Sans', 'Opensans', 'Liberation Sans', 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Arial, sans-serif, sans;
  font-weight: 400;
  margin-top:15px;
  font-size: 16px;
  height:16px;
  color:#000000;
  padding-left:25px;
  
}
#payupinterstitial #left{
  padding-top: 30px;
  float:left;
  width:460px;
}

#payupinterstitial .offerbox {
  font-weight: 400;
  font-size: 10px;
  float:left;
  margin-left:20px;
  cursor: pointer; cursor: hand; 
}

#payupinterstitial .offerbox.half {
  width: 210px;  
}

#payupinterstitial .offerbox.full {
  width: 440px;
}

#payupinterstitial .price {
  font-size:26px;
  font-weight: 600;
}

#payupinterstitial .offerbox:hover .price {
  color:#d10f0f;
}

#payupinterstitial h3.title {
  
  font-size: 14px;
  height:17px;
  font-weight: 600;
  border-bottom: solid 1px black;
  text-transform: uppercase;
  padding-bottom:4px;
  margin-bottom:0px;
}

#payupinterstitial .offerbox:hover h3.title {
  color:#d10f0f;
}

#payupinterstitial #soupup {
  margin-left:20px;
  padding-left:0px;
}

#payupinterstitial .offerbox ul {
  padding-left:0px;
  list-style-position: inside;
  font-size: 12px;
  margin-top:0px
}

#payupinterstitial blockquote {
  padding-left:0px;
  margin-left: 0px;
  font-size:11px;
  font-weight:400;
  font-style: italic;
}

#payupinterstitial #right {
  float:left;
  width:210px;
  height:320px;
  background-color:#d10f0f;
  color: #ffffff;
  margin-left:20px;
  margin-top: 49px;
}

#payupinterstitial #right h3 {
  margin-top:10px;
  margin-left: 10px;
  margin-right: 10px;
  font-size: 14px;
  font-weight: 600;
  border-bottom: solid 1px white;
  text-transform: uppercase;
  padding-bottom:6px;
  margin-bottom:0px;
}

#payupinterstitial #right ul{
  padding-left:25px;
  margin-right:10px;
  list-style-position: outside;
  font-size: 11px;
  margin-top: 10px;

}

#payupinterstitial #right li {
  margin-top:5px;
}

#payupinterstitial #right em {
  font-weight: 400;
}

#payupinterstitial .remark {
  margin-left: 10px;
  font-weight: 200;
  font-size: 12px;
}

#payupinterstitial .up {
  color:#d10f0f;
  font-weight:600;
}

#payupinterstitial .upsoup {
  color:#d10f0f;
  font-weight:400;
}

#payupinterstitial #infinitynines {
  background:-webkit-linear-gradient(0deg, #111111, #dddddd);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

}

#payupinterstitial .offerbox:hover #infinitynines {
  background:-webkit-linear-gradient(0deg, #d10f0f, #dddddd);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

#payupinterstitial #oink {
  position:absolute;
  width: 50px;
  height:30px;
  right:10px;
  top: 13px;
}

#payupinterstitial a {
  text-decoration:inherit;
  color: black;
}

#menu #oink {
  margin-left: -5px;
  position: absolute;
  margin-top: -2px;
  width: 24px;
  height:19px;
}

Some information about this website:

URL: http://yasminjqb8s4.soup.io/
CSS URL: http://static.soup.io/stylesheets/global.css
Title: Yasmin Packungsbeilage Preis