/*

#9c8974 braun m
#2d5c6e petrol d
#708a94 petrol h
#c7dbe9 petrol bright border
#e0e9f0 petrol bright bg
#464a4c kalter grauton
*/

/* COMMONS */
* {
    margin:                0;
    padding:               0;

    line-height:           1.5em;
    font-weight:           normal;
    color:                 #464a4c;
}

html {
    background:            #fff url(images/html-2.jpg) top center no-repeat;
    font-family:           Georgia, "Times New Roman", Times, serif;
}

body {
    background:            transparent;
    font-size:             0.625em;
}

#wrapper {
    background:            transparent url(images/wrapper.png) top left no-repeat;
    margin:                0 auto;
    width:                 980px;
    position:              relative;
    font-size:             1.5em;
}

/* LOGO */

.header {
    height:                180px;
    position:              relative;
    margin:                0;
}

.logo {
    position:              absolute;
    top:                   0;
    left:                  0;
    width:                 580px;
}

.logo h1 a {
    display:               block;
    width:                 330px;
    height:                130px;
    margin:                30px 0 0 20px;
    background:            transparent url(images/smartr-1.png) 0 0 no-repeat;
}

.logo h1 a span,
.logo p {
    display:               none;
}

/* ICONS */
.icons {
    position:              absolute;
    top:                   0;
    right:                 0;
    width:                 360px;
}

.icon {
    width:                 48px;
    height:                48px;
    display:               block;
    float:                 left;
    margin:                24px 12px 0 0;
    background:            transparent url(images/icons-sprite.png) 0 -48px no-repeat;
}

.icon:hover {
    background:            transparent url(images/icons-sprite.png) 0 0 no-repeat;
}

.icon span {
    display:               none;
}

#about {
    background-position:   -144px -48px
}

#about:hover {
    background-position:   -144px 0
}

#rss {
    background-position:   0 -48px
}

#rss:hover {
    background-position:   0 0
}

#twitter {
    background-position:   -48px -48px
}

#twitter:hover {
    background-position:   -48px 0
}

#facebook {
    background-position:   -96px -48px
}

#facebook:hover {
    background-position:   -96px 0
}

#icons-help {
    clear:                 both;
    color:                 #6597BA;
    font-size:             1.2em;
}

/* SEARCH */
#wrapper .search {
    position:              absolute;
    top:                   120px;
    right:                 0;
    width:                 360px;
}

#search-input {
    width:                 214px;
    height:                28px;
    -moz-border-radius:    3px;
    -webkit-border-radius: 3px;
    border-radius:         3px;
    border:                1px solid #ccc;
    padding:               5px;
    font-size:             1em;
    margin-right:          10px;
    color:                 #1A3E57;
}

#search-submit {
    width:                 80px;
    height:                40px;
    overflow:              hidden;
    border:                none;
    background:            transparent url(images/search-sprite-1.png) 0 0 no-repeat;
}

#search-submit:hover {
    background-position:   0 -40px;
}

#search-submit:active {
    background-position:   0 -80px;
}

/* PAGE */

.page {
    width:                 600px;
    float:                 left;
    position:              relative;
    z-index:               1;
}

.page .main {
    position:              relative;
    background:            transparent url(images/content-box-sprite.png) 0 0 repeat-y;
    margin:                24px 0 0 0;
}

.page .main .title {
    position:              relative;
    top:                   -24px;
    left:                  0;
    width:                 600px;
    height:                230px;
    overflow:              hidden;
    background:            transparent url(images/content-box-sprite.png) -600px 0 no-repeat;
}

.single h2 {
    width:                 578px;
    height:                210px;
    margin:                20px 0 0 11px;
    background:            transparent url(images/h0.jpg) 0 0 no-repeat;
}

h2 span {
    display:               block;
    position: absolute;
    bottom: 25px;
    line-height: 1.1em;
    width: 528px;
    background: transparent url(images/white-60.png);
    color: #2d5c6e;
    padding-left: 50px;
}

.listpage .main .title{
    height: 40px;
    position: relative;
    bottom: 30px;
    left: 78px;
}
.listpage h2 span {
    font-size:             32px;
    color:                 #fff;
    padding:               0 10px 0 60px;
    font-family:          "Segoe UI", Arial, Helvetica, sans serif;
    font-weight: bold;
    background: none;
}

.page .main .content {
    overflow:              hidden;
    padding:               0 11px 40px 11px;
}

a {
    color:                 #B1701D;
    text-decoration:       none;
}

a:hover {
    color:                 #6597BA;
}

a:visited {
    color:                 #8D6837;
}

h3 {
    font-family:           "Segoe UI", Arial, Helvetica, sans serif;
    font-size:             2em;
    margin:                60px 0 10px 0;
}

h4 {
    font-family:           "Segoe UI", Arial, Helvetica, sans serif;
    font-size:             1.25em;
    margin:                20px 0 5px 0;
}

p {
    margin-bottom:         1em;
}

img {
    border:                0
}

pre {
    background:            #eff4f8;
    border-top:            1px solid #d0e0ea;
    border-bottom:         1px solid #d0e0ea;
    padding:               30px;
    font-family:           Consolas, Monaco, "Courier New", Courier, monospace;
    font-size: 0.8em;
    margin-top:            0.5em;
    margin-bottom:         0.5em;
}

.showcase {
    background:            #f7f0e8;
    border-top:            1px solid #e7d4bb;
    border-bottom:         1px solid #e7d4bb;
    padding:               30px;
    font-family:           "Segoe UI", Arial, Helvetica, sans serif;
    margin-top:            0.5em;
    margin-bottom:         0.5em;
}

/* MORE */

.more {
    background:            transparent url(images/content-box-sprite.png) -1200px 0 no-repeat;
    padding-top:           20px;
    margin-top:            -1px;
    margin-bottom:         100px;
}

/* SIDEBAR */
.sidebar {
    font-family:           "Segoe UI", Arial, Helvetica, sans serif;
    margin-left:           590px;
    margin-bottom:         100px;
    width:                 380px;
    position:              relative;
    z-index:               100;
}

.sidebar ul {
    list-style-type:       none;
}

/* TAG CLOUD */
.tags {
    margin:                30px 50px 50px 50px;
    text-align:            center;
}

.tags a {
    color:                 #6597BA;
    text-decoration:       none;
}

.tags a:hover {
    color:                 #B1701D;
}

/* NAVIGATION */

ul.nav {
    list-style-type:       none;
    width:                 380px;
    padding:               24px 0;
    background:            transparent url(images/nav-box-sprite.png) 0 0 repeat-y;
}

ul.nav li.first {
    margin-top:            -48px;
    background:            transparent url(images/nav-box-sprite.png) -380px 0 no-repeat;
}

ul.nav li.last {
    margin-bottom:         -48px;
    background:            transparent url(images/nav-box-sprite.png) -760px 100% no-repeat;
}

ul.nav li a {
    display:               block;
    padding:               10px 30px;
    font-size:             0.85em;
    color:                 #6597BA;
    text-decoration:       none;
}

ul.nav li.first a {
    padding-top:           24px;
}

ul.nav li.last a {
    padding-bottom:        24px;
}

ul.nav li a:hover {
    color:                 #B1701D;
    background:            none;
    text-decoration:       none;
}

ul.nav li a.active {
    color:                 #1A3E57;
    text-decoration:       none;
}

ul.nav li a span {
    display:               block;
    font-size:             1.25em;
    font-weight:           bold;
    color:                 inherit;
}

/* SIDEBAR */
.sidebar .links h3 {
    height:                40px;
    overflow:              hidden;
    margin-left:           30px;
    background:            transparent url(images/themen-1.png) top left no-repeat;
}

.sidebar .facebook h3 {
    height:                40px;
    overflow:              hidden;
    margin-left:           30px;
    background:            transparent url(images/facebook-1.png) top left no-repeat;
}

.sidebar .item h3 span {
    display:               none;
}

/* THEMEN */
.cat-item {
    margin:                0 30px;
    font-size:             1em;
    color:                 #6597BA;
}

.cat-item a {
    font-weight:           bold;
    color:                 #80A2BA;
    text-decoration:       none;
}

/* FACEBOOK */
.facebook div {
    margin:                0 30px;
    font-size:             0.85em;
    color:                 #ccc;
}

/* FOOTER */
.footer {
    clear:                 both;
    background:            #fff url(images/footer.png) top left no-repeat;
}

.footer .archive,
.footer .links,
.footer .meta {
    margin:                20px 0 20px 30px;
    float:                 left;
}

.footer .archive,
.footer .links {
    width:                 200px;
}

.footer .meta {
    width:                 350px
}

.footer ul {
    list-style-type:       none;
}

.footer h3 {
    margin:                0;
    padding:               0;
    color:                 #a8a8a8;
    font-size:             1.25em;
}

.footer .link,
.archive li {
    font-size:             0.85em;
    color:                 #a8a8a8;
}

.footer a {
    color:                 #708a94;
    text-decoration:       none;
}

.footer a:hover {
    color:                 #9c8974;
}

.meta {
    font-size:             0.85em;
    color:                 #ccc;
}

.copyright {
    clear:                 both;
    text-align:            center;
    font-size:             0.85em;
    color:                 #a8a8a8;
    padding-bottom:        10px;
}

/* LIST PAGE */

.listpage {
    width:                 980px;
    background:            transparent url(images/home-box-sprite.png) -980px 0 repeat-y;
    margin-top:            50px;
    padding:               0;
}

.listpage .main {
    background:            transparent url(images/home-box-sprite.png) 0 0 no-repeat;
    position:              relative;
    top:                   -22px;
    left:                  -1px;
    padding:               30px 0 0 0;
}

.listpage .more {
    background:            transparent url(images/home-box-sprite.png) 100% 100% no-repeat;
    position:              relative;
    bottom:                -24px;
    left:                  -1px;
    padding:               60px 11px;
}

.listpage ul {
    list-style-type:       none;
    width:                  705px;
    margin:               0 auto 60px auto;
}

.listpage .post {
    margin:                0 5px 10px 5px;
    float:                 left;
}

.listpage .post a.post-link {
    display:               block;
    width:                  330px;
    height:                 245px;
    border: 1px solid #e8e8e8;
    padding:               5px 0;
    overflow:              hidden;
    text-decoration:       none;
    -moz-border-radius:    3px;
        -webkit-border-radius: 3px;
        border-radius:         3px;
    

}

.listpage .post a.post-link:hover {
    background:            #e9f0f5;
    border:1px solid #c3d9e9;
}

.post-link span {
    display:               block;
}

.listpage .post-image{
    width: 330px;
    height: 120px;
    background: url(images/h0-330.jpg) top left no-repeat;
}
.listpage .post-image img {
    border:                0
}

.listpage .paging {
    clear:                 both;
}

.listpage .post-date{
    font-family:           "Segoe UI", Arial, Helvetica, sans serif;
    color: #aaa;
    font-size: 0.8em;
    margin: 0 4px 6px 4px;
}
.listpage .post-title {
    font-size:             1.4em;
    line-height:           1.2em;
    color:                 #000;
    margin:                15px 4px 0 4px;
}

.listpage a.post-link:hover .post-title {
    color: #708a94;
}
/* SINGLE PAGE */

.single .content .excerpt {
    color:                 #888;
    font-family:           "Segoe UI", Arial, Helvetica, sans serif;
    padding:               20px 50px 20px 50px;
    font-size:             1.25em;
}

.single .content p,
.single .content h3,
.single .content h4,
.single .content ul,
.single .content ol,
.single .content blockquote {
    padding-left:          30px;
    padding-right:         30px;
}

.single .content h3 {
    font-size:             1.8em;
}

.single .content h4 {
    font-size:             1.35em
}

.single .content ul li,
.single .content ol li{
    margin-left: 20px;
}

.single .content code{
    font-size: 1.35em;
}

.single .comments-info {
    margin:                5px 30px 0 5px;
}

.single .comments-info div {
    float:                 right;
}

.single .comments-info div a {
    -moz-border-radius:    3px;
    -webkit-border-radius: 3px;
    border-radius:         3px;

    display:               block;
    padding:               4px;
    font-size:             0.8em;
    margin:                2px;
    border:                1px solid #9c8974;
    text-decoration:       none;
}

.single .meta {
    margin:                20px 40px 50px 40px;
}

.single .meta p {
    color:                 #888;
}

.single .meta p span {
    color:                 #ccc;
}

.single .meta a {
    text-decoration:       none;
}

/* COMMENTS */
.comments {
    margin:                10px;
}

.comments h3 {
    font-size:             2.5em;
    color:                 #ddd;
}

.comments h4 {
    margin-top:            50px;
    font-size:             2em;
    color:                 #ddd;
}

.comments ol {
    list-style-type:       lower-roman;
}

.comments ul {
    list-style-type:       none;
}

.comments li {
    margin:                0 0 20px 30px;
}

.comments .comment-item {
    position:              relative;
    -moz-border-radius:    5px;
    -webkit-border-radius: 5px;
    border-radius:         5px;
    padding:               10px;
    margin-bottom:         10px;
    border:                1px solid #ccc;
    background:            url(images/comment.png) bottom left repeat-x;
}

.comments .comment-meta {
    color:                 #aaa;
    font-size:             0.8em;
}

.comments .comment-meta a {
    color:                 #708a94;
    text-decoration:       none;
}

.comments .comment-meta a:hover {
    color:                 #9c8974;
}

.comments .reply a {
    display:               block;
    -moz-border-radius:    3px;
    -webkit-border-radius: 3px;
    border-radius:         3px;

    position:              absolute;
    bottom:                5px;
    right:                 5px;
    padding:               4px;
    font-size:             0.8em;
    color:                 #708a94;
    border:                1px solid #708a94;
    text-decoration:       none;
}

.comments .reply a:hover {
    color:                 #9c8974;
    border:                1px solid #9c8974;
}

.comments .comment-text {
    margin:                10px 0 20px 0;
}

.comments input,
.comments textarea {
    -moz-border-radius:    3px;
    -webkit-border-radius: 3px;
    border-radius:         3px;
    border:                1px solid #ccc;
    padding:               5px;
    font-size:             1em;
    color:                 #444;
}

.comments .input input {
    width:                 300px;
}

.comments .input textarea {
    width:                 600px;
    height:                300px;
}

.comments label {
    color:                 #ccc;
}

.comments label span {
    font-size:             0.85em;
    color:                 inherit;
}

/* PAGINATION */
.pagination {
    text-align: center;
    margin-top: 30px;
}

.pagination span {
    font-size: 1.25em;
    font-family:           "Segoe UI", Arial, Helvetica, sans serif;
    font-weight: bold;
    padding: 6px;
    border: 1px solid #c7dbe9;
}

.pagination a span{
    color: #708a94;
}


.pagination a:hover span{
    background: #e0e9f0
}