html { background: url('../images/main-bg.jpg');}

body {
    font: 14px arial,helvetica,clean,sans-serif;
   
    margin: 0;
    padding: 25px 0 10px 0;
}

#doc2 { width: 64.28em; }
#doc4 { width: 69.57em; }

a, a:link,a:visited,a:active {
	color: #2F84EA;
	text-decoration: none;
}

a:hover {
	color: #2F84EA;
	text-decoration: underline;
}

.navigation-link,
.navigation-link:link,
.navigation-link:visited,
.navigation-link:active { color: #555; }

p, ul, ol { margin-bottom: 10px;}

li { margin-bottom:  4px; }
ol,ul,dl {
	margin-left:2em;
}
ol li {
	list-style: decimal outside;
}
ul li {
	list-style: disc outside;
}

ul li ul li {
	list-style: circle outside;
}

strong,
strong.highlighted { font-weight: bold; }
.highlighted { font-weight: 600; }


body #hd {
    position: relative;
    padding: 0;

    text-shadow: 1px 1px 0px #fff;

    background: #ffffff;
    background: -moz-linear-gradient(top, #ffffff 0%, #e0e0e0 50%, #ffffff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(50%,#e0e0e0), color-stop(100%,#ffffff));
    background: -webkit-linear-gradient(top, #ffffff 0%,#e0e0e0 50%,#ffffff 100%);
    background: -o-linear-gradient(top, #ffffff 0%,#e0e0e0 50%,#ffffff 100%);
    background: -ms-linear-gradient(top, #ffffff 0%,#e0e0e0 50%,#ffffff 100%);
    background: linear-gradient(top, #ffffff 0%,#e0e0e0 50%,#ffffff 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 );
}

body #hd div { padding: 0; }

#hd .logo { float: left; margin: 14px 0 14px 30px; }
#hd .logo a { display: block; width: 85px; height: 85px; background: url('../images/logo.png') no-repeat; }

#hd .logo-text { float: left; padding-top: 12px; margin-top: 14px; }
#hd h1 { margin: 4px 0 0 0; padding: 0; font-size: 257%; font-weight: bold; line-height: 21px; }
#hd h2 { padding:0; margin-top: 9px; font-size: 129%; font-weight: normal; color: #6a6a6a;}

#hd h1 a, #hd h1 a:link, #hd h1 a:visited, #hd h1 a:active, #hd h1 a:hover { color: #000; text-decoration: none;  }
#hd h2 a, #hd h2 a:link, #hd h2 a:visited, #hd h2 a:active, #hd h2 a:hover { color: #6a6a6a; text-decoration: none; }

#hd h1 a {padding-left: 12px;}
#hd h2 a {padding-left: 15px;}

#ft { margin: 60px auto; text-align: center; color: #666}
#ft a, #ft a:link, #ft a:visited, #ft a:active { color: #666; text-decoration: none; }
#ft a:hover { text-decoration: underline; }
.homepage #ft { margin-top: 100px; }
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.pane {
    display: block;
    line-height: 1.5em;
    margin-bottom: 15px;
    padding: 20px 0 10px 0;

    background: #fff;
    border: 1px solid #ddd;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    -moz-box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);
    -o-box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);
}

#main-nav {
    clear: both;
    padding: 0;
    height:25px;
    line-height:25px;
    position: absolute;
    bottom: 0;
    right: 0;
}

#main-nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#main-nav ul li {
    margin: 0;
    padding: 0;
    height: 25px;
    float: left;
    display: block;
}

#main-nav li a {
  display: inline-block;
  height: 25px;
  font-size: 14px;
  padding: 0 10px;
  text-decoration: none;
  border-right: 1px inset #ddd;
}

#main-nav li.last a {
    border-right: 1px solid transparent;
}

#main-nav li a.active,
#main-nav li a:hover {
  border-top-right-radius: 5px;
  border-top-left-radius: 5px;
  text-decoration: none;

background: #ffffff;
background: -moz-linear-gradient(top,  #ffffff 0%, #dddddd 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#dddddd));
background: -webkit-linear-gradient(top,  #ffffff 0%,#dddddd 100%);
background: -o-linear-gradient(top,  #ffffff 0%,#dddddd 100%);
background: -ms-linear-gradient(top,  #ffffff 0%,#dddddd 100%);
background: linear-gradient(top,  #ffffff 0%,#dddddd 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dddddd',GradientType=0 );

}

#main-nav li a:hover {
    color: #000;
}

.pane h1 { font-size: 171%; font-weight: bold; color: #000; margin-bottom: 10px; }
.pane h1.long { line-height: 1.5em; }
.pane h2 { font-size: 150%; font-weight: bold; color: #000; margin-bottom: 10px; }
.pane h3 { font-size: 114%; font-weight: bold; color: #6a6a6a; margin-bottom: 10px; margin-top: 10px; }

.pane div,
.pane p,
.pane h1,
.pane h2,
.pane h3,
.pane ul
{ padding: 0 20px; }

.pane .palette div { padding: 0; }
.pane table { margin-left: 20px; }
.pane .img-right { float: right; margin: 5px 20px 10px 10px; }

body .product { text-align: center; height: 265px; padding: 0; position: relative}
.product h2 { margin: 20px auto 12px auto; font-weight: bold; font-size: 164%; color: #333; }
.product h3 { margin: 0 auto 15px auto; width: 315px; font-size: 114%; font-weight: normal; color: #6a6a6a; }
.product h2 a, .product h2 a:link, .product h2 a:visited, .product h2 a:active, .product h2 a:hover { color: #333; text-decoration: none; }
.product h3 a, .product h3 a:link, .product h3 a:visited, .product h3 a:active, .product h3 a:hover { color: #6a6a6a; text-decoration: none; }
.product .product-image a { display: block; width: 300px; height: 187px; margin: 20px auto;  }
.product .for-firefox { background: url('../images/pipette.png') no-repeat; }
.product .gradient-editor { background: url('../images/paint-tube.png') no-repeat; }

.product:hover { background: #f8f8f8; }
.product .all-pane-link { position: absolute; display: block; top:0; left:0; height: 265px; width: 100%; }
body .secondary-prod { display: none; }

.sidemenu { padding: 10px 0 15px 0;  }
.sidemenu p { font-size: 93%; margin-bottom: 4px;  }
.sidemenu h3 { color: #000;  font-size: 107%; margin-bottom: 2px; margin-top: 15px; }
.sidemenu h3.first { margin-top: 10px; }

.sidemenu .button {
	-moz-box-shadow:inset 0px 1px 0px 0px #97c4fe;
	-webkit-box-shadow:inset 0px 1px 0px 0px #97c4fe;
	box-shadow:inset 0px 1px 0px 0px #97c4fe;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #3d94f6), color-stop(1, #1e62d0) );
	background:-moz-linear-gradient( center top, #3d94f6 5%, #1e62d0 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#3d94f6', endColorstr='#1e62d0');
	background-color:#3d94f6;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #337fed;
	display:inline-block;
	color:#ffffff!important;
    text-decoration: none !important;
	font-family:arial;
	font-size:93%;
	font-weight:bold;
    width: 150px;
    height: 35px;
    line-height: 35px;
    text-align: center;
	text-shadow:1px 1px 0px #1570cd;
    margin-left: 20px;
    margin-top: 10px;
}

.sidemenu h2 {
    font-size: 93%;
    padding: 7px 0;
    text-align: center;
    margin-top: 0;

    background: #eeeeee;
    background: -moz-linear-gradient(top, #ffffff 0%, #eeeeee 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#eeeeee));
    background: -webkit-linear-gradient(top, #ffffff 0%,#eeeeee 100%);
    background: -o-linear-gradient(top, #ffffff 0%,#eeeeee 100%);
    background: -ms-linear-gradient(top, #ffffff 0%,#eeeeee 100%);
    background: linear-gradient(top, #ffffff 0%,#eeeeee 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee',GradientType=0 );
}

.sidemenu h2 a {
    color: #000 !important;
    text-shadow:1px 1px 0px #fff !important;
}

.button:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1e62d0), color-stop(1, #3d94f6) );
	background:-moz-linear-gradient( center top, #1e62d0 5%, #3d94f6 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#1e62d0', endColorstr='#3d94f6');
	background-color:#1e62d0;
}

.button:active {
	position:relative;
	top:1px;
}

.screenshot {  border: 1px solid #eee; }

.screenshot.continuous {  margin-bottom: 30px; }


.welcome .yui-gc div.first { width: 60%; height: 500px;}
.welcome .yui-gc .yui-u { width: 37.5%; }
.welcome .sponsored { padding-top: 10px; }
.welcome .sponsored .label {color:#666; margin-bottom: 0.5em; text-align: center }
.welcome .sponsored.rightrail .label { text-align:center}
.welcome .sponsored .what {font-size:0.8em}
.welcome .sponsored iframe { margin: 0 auto 10px auto; display: block; }

.welcome .sponsored .internal h2 { margin: 20px auto 12px auto; font-weight: bold; font-size: 136%; color: #333; padding: 0 10px; }
.welcome .sponsored .internal h3 { margin: 0 auto 15px auto; width: 315px; font-size: 114%; font-weight: normal; color: #6a6a6a; padding: 0 10px; }
.welcome .sponsored .internal h2 a { color: #333 !important; text-decoration: none !important; }
.welcome .sponsored .internal h3 a { color: #6a6a6a !important; text-decoration: none !important; }
.welcome .sponsored .internal .product-image { padding: 0; margin-top: 35px;  }
.welcome .sponsored .internal .product-image a { display: block; width: 300px; height: 187px; margin: 20px auto;  }
.welcome .sponsored .internal .gradient-editor { background: url('../images/paint-tube.png') no-repeat; }
.welcome .sponsored .internal .for-chrome { background: url('../images/pipette.png') no-repeat;  }
.welcome .sponsored .internal .sidemenu { margin: 42px 0 0 0; padding: 0; text-align: center;  }
.welcome .sponsored .internal .sidemenu .button { line-height: 30px; height: 30px; display: inline-block; margin: 0;}


/* BSA */
body .adpacks{background:#fff;padding:15px;margin:15px 0 0;border:3px solid #eee;}
body .one .bsa_it_ad{background:transparent;border:none;font-family:inherit;padding:0 15px 0 10px;margin:0;text-align:right;}
body .one .bsa_it_ad:hover img{-moz-box-shadow:0 0 3px #000;-webkit-box-shadow:0 0 3px #000;box-shadow:0 0 3px #000;}
body .one .bsa_it_ad .bsa_it_i{display:block;padding:0;float:none;margin:0 0 5px;}
body .one .bsa_it_ad .bsa_it_i img{padding:0;border:none;}
body .one .bsa_it_ad .bsa_it_t{padding:6px 0 0 0;}
body .one .bsa_it_p{display:none;}
body #bsap_aplink,body #bsap_aplink:hover{display:block;font-size:10px;margin:12px 15px 0;text-align:right;}

/* BSA tweaks */

body .sidemenu .one { padding: 5px 0 0 0 !important; }
body .sidemenu .one .bsa_it_ad { padding: 0; text-align: left; }
body .sidemenu #bsap_aplink { margin-top: 3px; margin-right: 7px; }

/* end BSA */