/* CSS Document */

body { background-color:#BB0000; background-image:url(http://www.ruszone.de/templates/orange/img/bg/ornament.png); background-attachment:fixed; }

#title_img { position:absolute; left:0px; top:0px; background-image:url(http://data.hlop.de/img/title/liebesbarometer.png); width:130px; height:110px; }

.bar { position:relative; height:20px; width:400px; border:2px solid #111111; background-color:#111111; color:#FFFFFF; }
.bar b { padding-left:2px; padding-right:2px; }
.pro_1 { position:absolute; top:0px; left:0px; height:20px; background-color:#CC0000; text-align:left; }
.pro_2 { position:absolute; top:0px; right:0px; height:20px; background-color:#FF0000; text-align:right; }
.bar_result { position:absolute; height:20px; background-color:#990000; }

#lovebar { margin-bottom:1px; }
#lovebar input { border:2px solid #111111; width:195px; }
#lovebar #button { width:100px; background-color:#CC0000; font-weight:bold; color:#FFFFFF; }


#lovebarometer { position:relative; width:468px; height:70px; }
#namebar { position:absolute; top:0px; left:0px; width:468px; height:36px; background-image:url(img/bar.png); }
#namebar .top { position:absolute; top:-10px; left:171px; z-index:10; }
#namebar .bottom { position:absolute; bottom:-7px; right:171px; z-index:10; }
.star { width:31px; height:31px; background-image:url(img/star.png); }

#name1 { position:absolute; top:7px; left:7px; width:175px; height:20px; padding:0px; border:none; }
#name2 { position:absolute; top:7px; right:7px; width:175px; height:20px; padding:0px; border:none; }
#button { position:absolute; text-shadow:1px 1px 2px #000,-1px -1px 2px #000; text-align:center; padding-bottom:4px; top:-3px; left:179px; width:110px; height:42px; background-color:transparent; border:none; background-image:url(img/button.png); color:#FFFFFF; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; font-weight:bold; cursor:pointer; }
#button:hover { background-image:url(img/button_h.png); text-shadow:1px 1px 5px #FFF,-1px -1px 5px #FFF; }
#resbar { position:absolute; top:32px; left:0px; width:468px; height:36px; background-image:url(img/bar.png); }
#lbar { position:absolute; top:7px; left:34px; width:400px; height:20px; background-image:url(img/lbar.png); }

#lbar .pro1 .bottom { position:absolute; bottom:-16px; left:-16px; z-index:10; }
#lbar .pro2 .top { position:absolute; top:-16px; right:-16px; z-index:10; }

#lbar .pro1 { position:absolute; top:0px; left:0px; height:20px; background-image:url(img/lbarh.png); border-right:1px solid #FFFFFF; }
#lbar .pro2 { position:absolute; top:0px; right:0px; height:20px; background-image:url(img/lbarh.png); border-left:1px solid #FFFFFF; }

#lbar .resbar { position:absolute; text-align:center; left:-1px; height:20px; border-left:1px solid #FFFFFF; border-right:1px solid #FFFFFF; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; font-weight:bold; color:#FFFFFF; padding-top:3px; }
.resbar .top { position:absolute; top:-16px; left:-16px; z-index:10; }
.resbar .bottom { position:absolute; bottom:-16px; right:-16px; z-index:10; }

.star { width:31px; height:31px; background-image:url(img/star.png); }
#pro1 { position:absolute; left:10px; top:10px; color:#990000; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; font-weight:bold; }
#pro2 { position:absolute; right:10px; top:10px; color:#990000; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; font-weight:bold; }