Картинка растягивается на ширину блока

Помогите с проблемой.

В шаблоне блога при размещении изображения само изображение растягивается на весь блог.

Фото:

Какой элемент можно применить к стилю, чтобы его зафиксировать в нормальном отображении и по центру страницы?

Полный файл стиля тут (убрать галочку при скачке чтобы просто скачать).

Вот сам стиль:

---

<style type="text/css">
 body {
    background: {block:IfNotBackgroundImageImage} url('{select:Pattern Style}') repeat {/block:IfNotBackgroundImageImage} {BackgroundColor};
    font-family: {select:Body Font}, Arial, sans-serif;
 }
h1, h2, h3, h4, .post-qoute blockquote, .search-results, .menu, .menu .nav-search form input, .menu-icon .title {
    font-family: {select:Header Font}, Arial, sans-serif;
}
{block:IfBackgroundImageImage}
#bg {
    position:fixed;
    top: 0px;
    width:100%;
    height:100%;
    background: url('{image:Background Image}') center center no-repeat;
    background-size: cover;
}
{/block:IfBackgroundImageImage}
a, a:active, cite {
    color: {AccentColor};
}
.menu {
    background:{color:Sidebar Background};
    color: {color:Sidebar Text Color};
}
#cx-header{
    background-color: {color:Header Background Color};
    border-top: 5px solid {AccentColor};
}
.logo-image img{
    width: {text:Header Logo Width}px;
    height: {text:Header Logo Height}px;
}
.logo-text{
    color: {color:Header Logo Text};
}
.cx-flickr ul li img:hover{
    border-color: {AccentColor};
    opacity: 1;
}
.cx-tagcloud a:hover,
.cx-tagcloud a:active,
.cx-tagcloud a:focus{
    background-color: {AccentColor};
    color: #fff;
}
#cx-footer{
    background-color: {color:Footer Background Color};
}
#cx-footer a.scroll-top:hover {
    background: {AccentColor};
    color: #fff;
    cursor: pointer;
}
.post-link .link h2 {
    color: #fff;
    background: {AccentColor};
}
.pace .pace-progress {
    background: {AccentColor};
}

.grid article img {
    outline: 0;
    border: none;
    display: block;
    width: 100%;
    height: 100%;
}

h2 {
    text-align: center;
}



{CustomCSS}
</style>

При изменении атрибутов в .grid article img на width: auto; и height: auto; изображение применяет свой исходный вид, т.е. становится как должно быть. НО! Большие изображения вылазят за размер блока и центрируются по левому краю.