html * { margin: 0px; padding: 0px; }
body { background-color: #0b63a1; font: 12px/16px Verdana, Geneva, Arial, Helvetica, Sans-Serif; margin:0px; padding:0px }
#page_background { background: transparent url('../template-blue/main-bg.png') repeat-x }

/* Header */
#header { height: 120px; background: transparent url('../template-blue/header-bg.png') repeat-x; font-size: 12px;}
#header_container { min-width: 980px; width:96%; max-width:1200px; margin: 0px auto; }
#header_container .left { width: 170px; text-align: center; float: left; }
#header_container .right { width: 300px; height: 120px; text-align: center; float: right; background: transparent url('../template-blue/basket-bg.png') no-repeat top; line-height: 14px;}
#header_container .content { margin: 0 300px 0 170px; text-align: center; }
#header .logo { position: relative; }
.page_title { color: #924116; font-size: 32px; line-height: 46px; font-weight: bold; }
.page_slogan { color: #924116; font-size: 16px; }
.page_hereya { color: #293c6c; font-size: 26px; line-height: 42px; font-weight: bold; letter-spacing: 2px; border: 1px solid #efefef; padding: 3px 25px; margin-top: 7px; background: transparent url('../template-blue/citymarker.png') repeat-x; }

#page_container { min-width: 980px; width:96%; max-width:1200px; min-height: 400px; margin: 0px auto; margin-top: 10px; position: relative; }
#content_container { width: 75%; min-width: 763px; float: left; position: relative; z-index:5; }

/* Navigation */
#navigation { min-width: 980px; height: 40px; border-top: 1px solid #c4c4c4; border-bottom: 1px solid #c4c4c4; background: #003b7f url('../template-blue/navi-bg.png') repeat-x; color: #ffffff; }
#navigation .content { min-width: 980px; width:96%; max-width:1200px; margin: 0px auto; }
#navigation ul#main_navi { position: relative; width: 400px; float: left; margin: 0px; margin-left: 160px; padding: 0px; list-style: none inside; text-align: center; }
#navigation ul#main_navi li { display: block; float: left; margin-right: 10px; }
#navigation ul#main_navi li a { display: block; height: 40px; padding: 0px 5px; line-height: 40px; text-decoration: none; font-size: 16px; background: #003b7f url('../template-blue/navi-norm.png') repeat-x top; color: #ffffff; text-align: center; }
#navigation ul#main_navi li a:hover { background-position: bottom; color: #004FAC; }
#navigation ul#main_navi li a.active { background-position: bottom; color: #004FAC; }
#navigation ul#main_navi ul { display: none; /*visibility: hidden;*/ position: absolute; z-index: 10; }
#navigation ul#main_navi li li { float: none; margin: 0px; min-width: 150px; }
#navigation ul#main_navi li:hover>ul { display: block; /*visibility: visible;*/ top: 100%; }
#navigation ul#main_navi li li:hover>ul { top: 0; left: 100%; }
#navigation ul#main_navi li li a { height: 30px; line-height: 30px; font-size: 12px; background: none; border: 1px solid #c0c0c0; background-color: #dbdbdb; color: #004FAC; }
#navigation ul#main_navi li li a:hover { background-color: #c7c7c7; }

#navigation ul#second_navi { position: relative; float: right; }
#navigation ul#second_navi li { display: block; float: left; margin-right: 5px; }
#navigation ul#second_navi li a { display: block; height: 40px; padding: 0px 5px; line-height: 40px; text-decoration: none; font-size: 14px; background: #003b7f url('../template-blue/navi-norm.png') repeat-x top; color: #ffffff; text-align: center; }
#navigation ul#second_navi li a:hover, #navigation ul#second_navi li:hover a { background-position: bottom; color: #004FAC; }
#navigation ul#second_navi li a.active { background-position: bottom; color: #004FAC; }
#navigation ul#second_navi ul { display: none; /*visibility: hidden;*/ position: absolute; z-index: 10; }
#navigation ul#second_navi li li { float: none; margin: 0px; }
#navigation ul#second_navi li:hover>ul { display: block; /*visibility: visible;*/ top: 100%; }
#navigation ul#second_navi li li:hover>ul { top: 0; left: 100%; }
#navigation ul#second_navi li li a { height: 30px; line-height: 30px; font-size: 12px; background: none; border: 1px solid #c0c0c0; background-color: #dbdbdb; color: #004FAC; }
#navigation ul#second_navi li li a:hover { background-color: #c7c7c7; }
#navigation ul#second_navi li a.logout { background: #ac0000 url('../template-blue/navi-logout.png') repeat-x top; color: #ffffff; }
#navigation ul#second_navi li a.logout:hover { background-position: bottom; color: #004FAC; }

/* main-content */
#content_container .box_body { position: relative; z-index:1; padding: 12px; }
#content_container .box-tr, #content_container .box-tl, #content_container .box-br, #content_container .box-bl, #content_container .box-tc, #content_container .box-bc, #content_container .box-cr, #content_container .box-cl 
{ position: absolute; z-index: -1; }
#content_container .box-tr, #content_container .box-tl, #content_container .box-br, #content_container .box-bl 
{ width: 60px; height: 60px; background-image: url('../template-blue/sheet-rect.png'); }
#content_container .box-tl { top: 0; left: 0; clip: rect(auto, 60px, 60px, auto); }
#content_container .box-tr { top: 0; right: 0; clip: rect(auto, auto, 60px, 20px); }
#content_container .box-bl { bottom: 0; left: 0; clip: rect(0px, 60px, auto, auto); }
#content_container .box-br { bottom: 0; right: 0; clip: rect(0px, auto, auto, 20px); }
#content_container .box-tc, #content_container .box-bc 
{ left: 40px; right: 40px; height: 60px; background-image: url('../template-blue/sheet-h.png'); }
#content_container .box-tc { top: 0; clip: rect(auto, auto, 42px, auto); }
#content_container .box-bc { bottom: 0; clip: rect(0px, auto, auto, auto); }
#content_container .box-cr, #content_container .box-cl 
{ top: 40px; bottom: 40px; width: 60px; background-image: url('../template-blue/sheet-v.png'); }
#content_container .box-cr { right:0; clip: rect(auto, auto, auto, 0px); }
#content_container .box-cl { left:0; clip: rect(auto, 42px, auto, auto); }
#content_container .box-cc { position: absolute; top: 40px; left: 40px; right: 40px; bottom: 40px; background-color: #ffffff; z-index: -1; }
#content_container .content_box { position: relative; z-index:0; min-width: 30px; min-height: 120px; margin-bottom: 20px;}
#content_container .box-header { height: 30px; background: transparent url('../template-blue/innerbox-header.png') no-repeat; color: #ffffff; }
#content_container .box-header-right { height: 30px; background: transparent url('../template-blue/innerbox-header-right.png') no-repeat right; text-align: center; }
#content_container .header-tag-icon { font-weight: bold; line-height: 30px; }

#content_container .innerbox { position:relative; z-index:0; min-width: 30px; min-height: 30px; margin-bottom: 10px; }
#content_container .innerbox_body { position: relative; z-index:1; padding: 10px; }
#content_container .innerbox-tr, #content_container .innerbox-tl, #content_container .innerbox-br, #content_container .innerbox-bl, #content_container .innerbox-tc, #content_container .innerbox-bc, #content_container .innerbox-cr, #content_container .innerbox-cl 
{ position: absolute; z-index: -1; }
#content_container .innerbox-tr, #content_container .innerbox-tl, #content_container .innerbox-br, #content_container .innerbox-bl 
{ width: 22px; height: 22px; background-image: url('../template-blue/innerbox-rect.png'); }
#content_container .innerbox-tl { top: 0; left: 0; clip: rect(auto, 22px, 22px, auto); }
#content_container .innerbox-tr { top: 0; right: 0; clip: rect(auto, auto, 22px, 10px); }
#content_container .innerbox-bl { bottom: 0; left: 0; clip: rect(0px, 22px, auto, auto); }
#content_container .innerbox-br { bottom: 0; right: 0; clip: rect(0px, auto, auto, 10px); }
#content_container .innerbox-tc, #content_container .innerbox-bc 
{ left: 10px; right: 10px; height: 22px; background-image: url('../template-blue/innerbox-h.png'); }
#content_container .innerbox-tc { top: 0; clip: rect(auto, auto, 10px, auto); }
#content_container .innerbox-bc { bottom: 0; clip: rect(0px, auto, auto, auto); }
#content_container .innerbox-cr, #content_container .innerbox-cl 
{ top: 10px; bottom: 10px; width: 22px; background-image: url('../template-blue/innerbox-v.png'); }
#content_container .innerbox-cr { right:0; clip: rect(auto, auto, auto, 0px); }
#content_container .innerbox-cl { left:0; clip: rect(auto, 10px, auto, auto); }
#content_container .innerbox-cc { position: absolute; top: 10px; left: 10px; right: 10px; bottom: 10px; background-color: #ffffff; z-index: -1; }


/* sidebar */
#sidebar { min-width: 190px; width: 20%; max-width: 320px; float: left; margin-left: 20px;}
#sidebar .box { position: relative; z-index:0; min-width: 30px; min-height: 30px; margin-bottom: 20px;}
#sidebar .box .box-content { position: relative; z-index:1; padding: 12px; padding-top: 0px;}
#sidebar .box-tr, #sidebar .box-tl, #sidebar .box-br, #sidebar .box-bl, #sidebar .box-tc, #sidebar .box-bc, #sidebar .box-cr, #sidebar .box-cl 
{ position: absolute; z-index: -1; }
#sidebar .box-tr, #sidebar .box-tl, #sidebar .box-br, #sidebar .box-bl 
{ width: 60px; height: 60px; background-image: url('../template-blue/sheet-rect.png'); }
#sidebar .box-tl { top: 0; left: 0; clip: rect(auto, 60px, 60px, auto); }
#sidebar .box-tr { top: 0; right: 0; clip: rect(auto, auto, 60px, 20px); }
#sidebar .box-bl { bottom: 0; left: 0; clip: rect(0px, 60px, auto, auto); }
#sidebar .box-br { bottom: 0; right: 0; clip: rect(0px, auto, auto, 20px); }
#sidebar .box-tc, #sidebar .box-bc
{ left: 40px; right: 40px; height: 60px; background-image: url('../template-blue/sheet-h.png'); }
#sidebar .box-tc { top: 0; clip: rect(auto, auto, 42px, auto); }
#sidebar .box-bc { bottom: 0; clip: rect(0px, auto, auto, auto); }
#sidebar .box-cr, #sidebar .box-cl
{ top: 40px; bottom: 40px; width: 60px; background-image: url('../template-blue/sheet-v.png'); }
#sidebar .box-cr { right:0; clip: rect(auto, auto, auto, 0px); }
#sidebar .box-cl { left:0; clip: rect(auto, 42px, auto, auto); }
#sidebar .box-cc
{ position: absolute; top: 40px; left: 40px; right: 40px; bottom: 40px; background-color: #ffffff; z-index: -1; }
#sidebar .box-header { height: 40px; background: transparent url('../template-blue/box-header.png') no-repeat; color: #ffffff; }
#sidebar .box-header-right { height: 40px; background: transparent url('../template-blue/box-header-right.png') no-repeat right; text-align: center; }
#sidebar .header-tag-icon { font-weight: bold; font-size: 13px; line-height: 30px; }

/* Footer */
#footer { margin-top: 15px; height: 74px; min-width: 980px; background: #ffffff url('../template-blue/footer-bg.png') repeat-x; font-size: 11px; line-height: 14px; text-align: center; }
#footer .art-Footer-inner { width: 700px; margin: 0px auto; padding-top: 7px; position: relative; }

/* button */
.art-button-wrapper .art-button { display: inline-block; width: auto; outline: none; border: none; background: none; margin: 0 !important; padding: 0 !important; cursor: pointer; z-index: 0; height: 32px; font-size: 14px; padding: 0 14px !important; line-height: 28px; text-decoration: none !important; color: #FFFFFF !important; }
.art-button-wrapper { display: inline-block; position: relative; height: 32px; overflow: hidden; white-space: nowrap; width: auto; z-index: 0; }
.art-button-wrapper.hover .art-button, .art-button:hover
{ color: #ffffff !important; text-decoration: none !important; }
.art-button-wrapper.active .art-button { color: #F0F0F0 !important; }
.art-button-wrapper .l, .art-button-wrapper .r 
{ display: block; position: absolute; z-index: -1; height: 96px; background-image: url('../template-blue/Button.png'); }
.art-button-wrapper .l { left: 0; right:9px; }
.art-button-wrapper .r { width: 411px; right: 0; clip: rect(auto, auto, auto, 402px); }
.art-button-wrapper.hover .l, .art-button-wrapper.hover .r { top: -32px; }
.art-button-wrapper.active .l, .art-button-wrapper.active .r { top: -64px; }

/* Price-Boxes */
#deal-top-box { padding-left: 110px; padding-bottom: 10px; height: 60px;}
#live-top-box { padding-left: 110px; padding-bottom: 10px; height: 60px;}
#timebar { margin: 3px auto; width: 244px; }
#timebar.live { margin: 3px auto; width: 183px; }
#remainbar { height: 110px; position: relative; width: 300px; margin: 0px auto;}
#deal-bar { position: absolute; top: 44px; }


#deal-need, #deal-sold, #deal-remain { display: block; position: absolute; top: 0px; width: 60px; height: 100px; text-align: center; }
#deal-need { background: transparent url('../template-blue/paddel-down.png') no-repeat center top; }
#deal-remain { background: transparent url('../template-blue/paddel-up.png') no-repeat center bottom; padding-top: 0px; font-weight: bold; }
#deal-sold { background: transparent url('../template-blue/paddel-down.png') no-repeat center top ; }
#deal-need, #deal-sold { margin-top: 3px }
#deal-remain { margin-top: 8px }
#deal-need span, #deal-sold span, #deal-remain span { font-size: 12px; line-height: 33px; color: #ffffff; font-weight: normal; }
#dealaktiv { position: absolute; font-size: 22px; color: #31b51e; width: 160px; margin-top: 18px; margin-left: 140px; }

#live-start, #live-remain, #live-end { display: block; position: absolute; top: 0px; width: 60px; height: 90px; padding-top: 0px; text-align: center; }
#live-start span, #live-remain span, #live-end span { font-size: 12px; line-height: 33px; color: #ffffff; font-weight: normal; }
#live-start { background: transparent url('../template-blue/paddel-up.png') no-repeat top; }
#live-remain { background: transparent url('../template-blue/paddel-down.png') no-repeat top; font-weight: bold; }
#live-remain { margin-top: 4px;}
#live-end { background: transparent url('../template-blue/paddel-up.png') no-repeat top; }
.price { font: bold 40px/48px "Times New Roman", Times, serif; color: #31b51e; text-align: center; margin-left: -30px; }
.time { display: block; height: 45px; width: 61px; float: left; font-family: "Times New Roman", Times, serif; background: transparent url('../template-blue/countdown-bg.gif') no-repeat top; text-align: center; }
.time span{ font-size: 20px; line-height: 32px; color: #ffffff; }