/*
  Style Sheet for Application Database (C4)
  for CodeWeavers Website
  by Jeremy Newman <jnewman@codeweavers.com>  
*/

.tabber .body_title { font-size: 24px; padding-bottom: 10px !important; }

#block_dl
{
    margin-top:20px; background: url('../../images/store/checkout_step_1.png') no-repeat left top; padding-left: 60px;
}
.bigbut_gr, .bigbut_bl, .bigbut_or { width: 440px; font-size: 13px; font-weight: bolder; }
#block_c4p
{
    margin-top: 20px; background: url('../../images/store/checkout_step_2.png') no-repeat left top; padding-left: 60px;
}
#block_c4p ol { margin-top: 5px; padding-left: 1.8em; }
#block_c4p ol li { margin-bottom: 0.5em; font-size: 10px; }
#block_buy
{
    margin-top: 20px; background: url('../../images/store/checkout_step_3.png') no-repeat left top; padding-left: 60px;
}

a.app_view_button { display: inline-block; width: 450px; text-align: center; }

.medalBox
{
    display: inline-block;
    margin: 0 10px 10px 10px;
    padding: 5px;
    width: 120px;
    background: #b3c6d0;
    background: -moz-radial-gradient(center, ellipse cover,  #b3c6d0 0%, #436676 100%);
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#b3c6d0), color-stop(100%,#436676));
    background: -webkit-radial-gradient(center, ellipse cover,  #b3c6d0 0%,#436676 100%);
    background: -o-radial-gradient(center, ellipse cover,  #b3c6d0 0%,#436676 100%);
    background: -ms-radial-gradient(center, ellipse cover,  #b3c6d0 0%,#436676 100%);
    background: radial-gradient(ellipse at center,  #b3c6d0 0%,#436676 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3c6d0', endColorstr='#436676',GradientType=1 );

}
.medalBox img { vertical-align: -1px; }
.medalBox h4 { margin: 0; color: #ffffff; font-size: 12px; text-align: center; }
.medalBox hr { color: #ffffff; background-color: #ffffff; width: 105px; }
.medalBox p { margin: 0; font-size: 9px; text-align: center; color: #ffffff; }
.medalBox:hover
{
    background: #b5bdc8;
    background: -moz-radial-gradient(center, ellipse cover,  #b5bdc8 0%, #828c95 36%, #28343b 100%);
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#b5bdc8), color-stop(36%,#828c95), color-stop(100%,#28343b));
    background: -webkit-radial-gradient(center, ellipse cover,  #b5bdc8 0%,#828c95 36%,#28343b 100%);
    background: -o-radial-gradient(center, ellipse cover,  #b5bdc8 0%,#828c95 36%,#28343b 100%);
    background: -ms-radial-gradient(center, ellipse cover,  #b5bdc8 0%,#828c95 36%,#28343b 100%);
    background: radial-gradient(ellipse at center,  #b5bdc8 0%,#828c95 36%,#28343b 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b5bdc8', endColorstr='#28343b',GradientType=1 );
}

.medalbg4, .medalbg_gold
{
    background: #fbe368;
    background: -webkit-gradient(linear, left top, left bottom, from(#fbe368), to(#f39902));
    background: -moz-linear-gradient(top,  #fbe368,  #f39902);
}
.medalbg3, .medalbg_silver
{
    background: #e5e2d5;
    background: -webkit-gradient(linear, left top, left bottom, from(#e5e2d5), to(#b9b6a2));
    background: -moz-linear-gradient(top,  #e5e2d5,  #b9b6a2);
}
.medalbg2, .medalbg_bronze
{
    background: #dab5a7;
    background: -webkit-gradient(linear, left top, left bottom, from(#dab5a7), to(#945a49));
    background: -moz-linear-gradient(top,  #dab5a7,  #945a49);
}
.medalbg1, .medalbg_known_not_to_work
{
    background: #bc6e6e;
    background: -webkit-gradient(linear, left top, left bottom, from(#bc6e6e), to(#760303));
    background: -moz-linear-gradient(top,  #bc6e6e,  #760303);
}
.medalbg0, .medalbg_untested
{
    background: #73a2d4;
    background: -webkit-gradient(linear, left top, left bottom, from(#73a2d4), to(#0056b2));
    background: -moz-linear-gradient(top,  #73a2d4,  #0056b2);
}

.medalbg4 .medal_name, .medalbg_gold .medal_name { color: #97883E; text-shadow: 1px 1px 0px #E0DBC5; }
.medalbg3 .medal_name, .medalbg_silver .medal_name { color: #333333; text-shadow: 1px 1px 0px #efefef; }
.medalbg2 .medal_name, .medalbg_bronze .medal_name { color: #4C331A; text-shadow: 1px 1px 0px #C2A385; }
.medalbg1 .medal_name, .medalbg_known_not_to_work .medal_name { color: #D6B3B3; text-shadow: 1px 1px 0px #330000; }
.medalbg0 .medal_name, .medalbg_untested .medal_name { color: #C7DAEE; text-shadow: 1px 1px 0px #2E4155; }

table.frame td.app_medal     { font-size: 10px; }
table.frame td.app_medal img { float: right; vertical-align: middle; }