CSS with WebKit gradient bug

/*
Theme Name: Marko Idzan custom web template
Theme URI: http://underscores.me/
Author: Marko Idzan
Author URI: http://markoidzan.from.hr
Description: Custom made template for my personal web/blog
Version: 1.0
License: GNU General Public License
License URI: license.txt
Tags:

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Resetting and rebuilding styles have been helped along thanks to the fine work of
Eric Meyer http://meyerweb.com/eric/tools/css/reset/index.html
along with Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
and Blueprint http://www.blueprintcss.org/
*/

@font-face {
font-family : "'Monda'";
font-style : normal;
font-weight : 400;
src : local('Monda Regular'), local('Monda-Regular'), url(http://themes.googleusercontent.com/static/fonts/monda/v1/Ar_3VpXmUWnrZSibgBG1mA.ttf) format('truetype');
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
border : 0;
font-family : inherit;
font-size : 100%;
font-style : inherit;
font-weight : inherit;
margin : 0;
outline : 0;
padding : 0;
vertical-align : baseline;
}
html {
font-size : 62.5%;
overflow-y : scroll;
}
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
display : block;
}
ol, ul {
list-style : none;
}
table {
border-collapse : separate;
border-spacing : 0;
}
caption, th, td {
font-weight : normal;
text-align : left;
}
blockquote:before, blockquote:after, q:before, q:after {
content : "";
}
blockquote, q {
quotes : "" "";
}
a:focus {
outline : thin dotted;
}
a:hover, a:active {
outline : 0;
}
a img {
border : 0;
}
body, button, input, select, textarea {
color : #000000;
font-family: 'Monda', sans-serif;
font-size : 16px;
font-size : 1.6rem;
line-height : 1.5;
background:
radial-gradient(black 15%, transparent 16%) 0 0,
radial-gradient(black 15%, transparent 16%) 8px 8px,
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
background-color:#282828;
background-size:16px 16px;

}
h1, h2, h3, h4, h5, h6 {
clear : both;
margin : 0.6em 0;
}
h1 {
font-size : 36px;
font-size : 3.6rem;
}
h2 {
font-size : 28px;
font-size : 2.8rem;
}
h3 {
font-size : 22px;
font-size : 2.2rem;
}
h4 {
font-size : 16px;
font-size : 1.6rem;
}
h5 {
font-size : 14px;
font-size : 1.4rem;
}
h6 {
font-size : 12px;
font-size : 1.2rem;
}
hr {
background-color : #fff;
border : 0;
height : 1px;
margin-bottom : 1.5em;
}
p {
margin-bottom : 1.5em;
}
ul, ol {
margin : 0 0 1.5em 3em;
}
ul {
list-style : disc;
}
ol {
list-style : decimal;
}
ul ul, ol ol, ul ol, ol ul {
margin-bottom : 0;
margin-left : 1.5em;
}
dt {
font-weight : bold;
}
dd {
margin : 0 1.5em 1.5em;
}
b, strong {
font-weight : bold;
}
dfn, cite, em, i {
font-style : italic;
}
blockquote {
font-style : italic;
margin : 0 1.5em;
}
address {
margin : 0 0 1.5em;
}
pre {
background : #8E8A82;
font-family : "Courier 10 Pitch", Courier, monospace;
font-size : 15px;
font-size : 1.5rem;
line-height : 1.6;
margin-bottom : 1.6em;
padding : 1.6em;
overflow : auto;
max-width : 100%;
}
code, kbd, tt, var {
font : 15px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}
abbr, acronym {
border-bottom : 1px dotted #666;
cursor : help;
}
mark, ins {
background : #fff9c0;
text-decoration : none;
}
sup, sub {
font-size : 75%;
height : 0;
line-height : 0;
position : relative;
vertical-align : baseline;
}
sup {
bottom : 1ex;
}
sub {
top : 0.5ex;
}
small {
font-size : 75%;
}
big {
font-size : 125%;
}
figure {
margin : 0;
}
table {
margin : 0 0 1.5em;
width : 100%;
}
th {
font-weight : bold;
}
button, html input[type="button"], input[type="reset"], input[type="submit"] {
border : #ccc solid 1px;
border-color : #ccc #ccc #bbb #ccc;
border-radius : 3px;
background : #e6e6e6;
box-shadow : 0 1px 0 rgba(255, 255, 255, 0.5) inset, 0 15px 17px rgba(255, 255, 255, 0.5) inset, 0 -5px 12px rgba(0, 0, 0, 0.05) inset;
color : rgba(0, 0, 0, 0.8);
cursor : pointer;
font-size : 12px;
font-size : 1.4rem;
line-height : 1;
padding : 1.12em 1.5em 1em;
text-shadow : 0 1px 0 rgba(255, 255, 255, 0.8);
}
button:hover, html input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover {
border-color : #ccc #bbb #aaa #bbb;
box-shadow : 0 1px 0 rgba(255, 255, 255, 0.8) inset, 0 15px 17px rgba(255, 255, 255, 0.8) inset, 0 -5px 12px rgba(0, 0, 0, 0.02) inset;
}
button:focus, html input[type="button"]:focus, input[type="reset"]:focus, input[type="submit"]:focus, button:active, html input[type="button"]:active, input[type="reset"]:active, input[type="submit"]:active {
border-color : #aaa #bbb #bbb #bbb;
box-shadow : 0 -1px 0 rgba(255, 255, 255, 0.5) inset, 0 2px 5px rgba(0, 0, 0, 0.15) inset;
}
input[type="checkbox"], input[type="radio"] {
box-sizing : border-box;
padding : 0;
}
input[type="search"] {
box-sizing : content-box;
}
input[type="text"], input[type="email"], textarea {
background : rgba(255, 255, 255, 0.3);
border : #ccc solid 1px;
border-radius : 3px;
padding : 6px;
}
input[type="text"]:focus, input[type="email"]:focus, textarea:focus {
background : #fff;
}
textarea {
overflow : auto;
padding-left : 3px;
vertical-align : top;
width : 98%;
}
a, a:visited {
color : #735D1B;
text-decoration : none;
transition : all 0.3s ease-in-out;
}
a:hover, a:focus, a:active {
color : #D3A20F;
}
.alignleft {
display : inline;
float : left;
margin-right : 1.5em;
margin-bottom : 1em;
}
.alignright {
display : inline;
float : right;
margin-left : 1.5em;
margin-bottom : 1em;
}
.aligncenter {
clear : both;
display : block;
margin : 1.5em auto;
}
.assistive-text {
clip : rect(1px 1px 1px 1px);
clip : rect(1px,1px,1px,1px);
position : absolute !important ;
}
.site-title, .entry-title, .page-title, .entry-content, .entry-summary, .widget-title, .comments-title, .comment .reply, .comment-meta, .comment-author, #reply-title {
font-family: 'Monda', sans-serif;

}
#main, .main-navigation, .site-title, .site-description {
margin : 0 auto;
max-width : 1050px;
}
#main {
clear : both;
overflow : hidden;
}
#primary {
float : left;
margin : 0 -27% 0 0;
padding : 2em;
width : 90%;
}
#content {
margin : 0 27% 0 0;
}
#secondary, #tertiary {
background : #fff;
float : right;
margin : 1em 1em 0;
padding : 2em 2em 0;
position : relative;
width : 20%;
}
#tertiary {
padding-top : 0;
}
.site-footer {
clear : both;
width : 100%;
}
.site-header hgroup {
background:
radial-gradient(black 15%, transparent 16%) 0 0,
radial-gradient(black 15%, transparent 16%) 8px 8px,
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
background-color:#282828;
background-size:16px 16px;

padding : 1.5em 2em;
}
.site-title {
font-size : 50px;
font-size : 4.5rem;
font-style : italic;
}
.site-description {
font-size : 13px;
font-size : 1.3rem;
}
.site-title a, .site-description {
color : #FFFFFF;
}
.main-navigation {
clear : both;
display : block;
padding : 1.5em;
}
.main-navigation:after {
clear : both;
content : "";
display : block;
}
.main-navigation ul {
list-style : none;
margin : 0;
padding-left : 0;
}
.main-navigation li {
float : left;
margin : 0.5em 0;
position : relative;
}
.main-navigation a {
color : #CCC8BF;
display : block;
font-size : 1.4rem;
font-weight : bold;
margin-right : 2em;
text-decoration : none;
}
.main-navigation ul ul {
background : #000000;
border : rgba(0, 0, 0, 0.1) solid 1px;
display : none;
float : left;
position : absolute;
top : 1.2em;
left : 0;
z-index : 99999;
}
.main-navigation ul ul ul {
left : 100%;
top : 0;
}
.main-navigation ul ul a {
padding : 0 1.5em;
width : 200px;
}
.main-navigation li:hover > a, .main-navigation li.current_page_item a, .main-navigation li.current-menu-item a, .main-navigation ul ul a:hover {
color : #ffffff;
}
.main-navigation ul li:hover > ul {
display : block;
}
.menu-toggle {
color : #000000;
cursor : pointer;
font-size : 20px;
font-weight : bold;
text-align : center;
}
.main-small-navigation .menu {
display : none;
}
.site-main {
background : #fff;
border : rgba(0, 0, 0, 0.1) solid 1px;
border-width : 3px 1px;
}
.hentry {
border-bottom : 1px solid rgba(0, 0, 0, 0.1);
margin : 0 0 1.5em;
padding-bottom : 1.5em;
}
.entry-title, .page-title {
font-size : 28px;
font-size : 2.8rem;
font-style : italic;
margin : 0 0 0.2em;
}
.entry-title a {
text-decoration : none;
}
body.search .page-title, body.archive .page-title {
font-size : 16px;
font-size : 1.6rem;
margin-bottom : 1em;
}
.entry-meta {
clear : both;
font-size : 12px;
font-size : 1.2rem;
}
.byline {
display : none;
}
.single .byline, .group-blog .byline {
display : inline;
}
.entry-content, .entry-summary {
margin : 1.5em 0 0;
}
.entry-content table, .comment-content table {
border : #d9d9d9 solid 1px;
border-left-width : 0;
margin : 0 -0.083em 2.083em 0;
text-align : left;
width : 100%;
}
.entry-content tr th, .entry-content thead th, .comment-content tr th, .comment-content thead th {
border-left : 1px solid #d9d9d9;
font-weight : bold;
padding : 0.5em 1.25em;
}
.entry-content tr td, .comment-content tr td {
border : #d9d9d9 solid 1px;
border-width : 1px 0 0 1px;
padding : 0.5em 1.25em;
}
.entry-content tr.odd td, .comment-content tr.odd td {
background : #dfd6c7;
}
.page-links {
clear : both;
margin : 0 0 1.5em;
}
.format-aside .entry-content {
border-left : 4px solid rgba(0, 0, 0, 0.1);
padding-left : 1em;
}
.site-header img, .entry-content img, .comment-content img, .widget img {
max-width : 100%;
}
.site-header img, .entry-content img, .widget-img, img[class*="align"], img[class*="wp-image-"], .wp-caption img {
height : auto;
}
.site-header img, .entry-content img, .widget img, img.size-full {
max-width : 100%;
width : auto;
}
.entry-content img.wp-smiley, .comment-content img.wp-smiley {
border : none;
margin-bottom : 0;
margin-top : 0;
padding : 0;
}
.wp-caption {
border : #ccc solid 1px;
max-width : 100%;
}
.wp-caption.aligncenter, .wp-caption.alignleft, .wp-caption.alignright, .wp-caption.alignnone {
margin-bottom : 1.5em;
}
.wp-caption img {
display : block;
margin : 1.2% auto 0;
max-width : 98%;
}
.wp-caption-text {
text-align : center;
}
.wp-caption .wp-caption-text {
margin : 0.8075em 0;
}
#content .gallery {
margin-bottom : 1.5em;
}
.wp-caption-text, .gallery-caption {
font-size : 12px;
font-size : 1.2rem;
font-style : italic;
}
#content .gallery a img {
border : none;
height : auto;
max-width : 90%;
}
#content .gallery dd {
margin : 0;
}
embed, iframe, object {
max-width : 100%;
}
.site-content .site-navigation {
font-size : 13px;
font-size : 1.3rem;
font-style : italic;
margin : 0 0 1.5em;
overflow : hidden;
}
.site-content .nav-previous {
float : left;
width : 50%;
}
.site-content .nav-next {
float : right;
text-align : right;
width : 50%;
}
#comments {
clear : both;
}
.comments-title, #reply-title {
font-size : 20px;
font-size : 2rem;
}
.commentlist li {
list-style : none;
}
.commentlist, .children {
list-style : none;
margin : 0;
}
.children {
margin : 0 0 0 6%;
}
.commentlist li.comment, .commentlist li.pingback {
border-bottom : 1px solid rgba(0, 0, 0, 0.2);
padding-left : 2.5em;
}
.commentlist .children li, .commentlist li:last-of-type {
border : none;
}
article.comment, li.pingback {
overflow : hidden;
padding : 2.5em 0 0.7em;
position : relative;
}
.children article.comment, .children li.pingback {
padding-top : 1.0em;
}
.comment .avatar {
float : left;
margin-right : 1.25em;
}
.comment-author {
font-size : 14px;
font-size : 1.4rem;
}
.comment-meta {
font-size : 12px;
font-size : 1.2rem;
}
.comment-content {
font-size : 13px;
font-size : 1.3rem;
margin : 1em 0 0 4.5em;
}
.comment .reply {
font-size : 12px;
font-size : 1.2rem;
text-align : right;
}
li.pingback {
font-weight : bold;
}
li.pingback a {
font-weight : normal;
}
.comment-notes, #commentform .form-allowed-tags, p.nocomments, p.logged-in-as, #commentform label {
font-size : 13px;
font-size : 1.3rem;
}
.required {
color : #880000;
}
#commentform label {
font-weight : bold;
padding : 1em 0;
}
#commentform input[type="text"] {
margin-left : 0.5em;
}
#commentform #comment {
margin-top : 0.6em;
}
#commentform .form-allowed-tags, #commentform .form-allowed-tags code {
font-size : 11px;
font-size : 1.1rem;
}
p.nocomments {
margin : 2.5em;
}
.widget {
font-size : 12px;
font-size : 1.2rem;
line-height : 1.8;
margin : 0 0 1.5em;
}
.widget-title {
color : #000;
font-size : 20px;
font-size : 2rem;
font-style : italic;
}
#searchsubmit {
display : none;
}
.site-info {
font-size : 13px;
font-size : 1.3rem;
padding : 1.5em 0;
text-align : center;
}
@media only screen and (max-width:800px) {
#main {
overflow : visible;
}
#content, #primary, #secondary, #tertiary {
background : #ffffff;
float : none;
margin : 0;
padding : 0;
}
#primary, #secondary, #tertiary {
width : 100%;
}
.site-header hgroup, #main {
padding : 0.8em;
}
}
#ie8 .site-header img, #ie8 .entry-content img, #ie8 img.size-full, #ie8 .entry-thumbnail img, #ie8 .widget img, #ie8 .wp-caption img {
width : auto;
}