/**
05/TYPOGRAPHY
=====================================================================**/
/** FONT FAMILY **/
body, textarea, button, input, select   { font-family: "museo-slab-n3","museo-slab","Rockwell","Georgia",serif; font-style: normal; font-weight: 300; }
.massive                                { font-family: "museo-slab-n1","museo-slab","Rockwell","Georgia",serif; font-style: normal; font-weight: 100; }
h1, .h1, h2, .h2, h3, .h3,
    .nav_filtering,
    /*.media*/ .title, button, .btn
                                        { font-family: "museo-slab-n7","museo-slab","Rockwell","Georgia",serif; font-style: normal; font-weight: 700; }
.lead                                   { /* 900? */ }


    /* font weights */
    .fw_100         { font-family: "museo-slab-n1","museo-slab","Rockwell","Georgia",serif !important; font-style: normal !important; font-weight: 100 !important; }
        .fw_100_i   { font-family: "museo-slab-i1","museo-slab","Rockwell","Georgia",serif !important; font-style: italic !important; font-weight: 100 !important; }
    .fw_300         { font-family: "museo-slab-n3","museo-slab","Rockwell","Georgia",serif !important; font-style: normal !important; font-weight: 300 !important; }
        .fw_300_i   { font-family: "museo-slab-i3","museo-slab","Rockwell","Georgia",serif !important; font-style: italic !important; font-weight: 300 !important; }
    .fw_700, strong, .strong
                    { font-family: "museo-slab-n7","museo-slab","Rockwell","Georgia",serif !important; font-style: normal !important; font-weight: 700 !important; }


/** HEADINGS, PARAGRAPHS, LISTS... **/
/* font sizes and styles */
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6, legend, .massive, .large { letter-spacing: 0; font-style: normal; /*text-transform: none;*/ /*color: #333;*/ }
h1, .h1 { font-size: 36px; line-height:   1; letter-spacing: -.03em; }
h2, .h2, /*.media*/ .title
        { font-size: 30px; line-height: 0.933333; letter-spacing: -.00em; }
h3, .h3
        { font-size: 24px; line-height: 1.0; letter-spacing: -.01em; }
h4, .h4 { font-size: 18px; line-height: 1.1; }
h5, .h5 { font-size: 14px; line-height: 1.2; }
h6, .h6 { font-size: 12px; line-height: 1.5; }

p, .p, li, dl, table    { font-size: 14px; line-height: 1.428571; letter-spacing: 0; }

    /* additional font sizes and line heights */
    .massive            { font-size: 60px !important; line-height: 0.8 !important; text-transform: none; letter-spacing: -.05em; }
    .large              { font-size: 48px !important; line-height: 0.958333 !important; text-transform: none; letter-spacing: -.05em; }
    .small, .small li   { font-size: 12px !important; line-height: 1.538462 !important; text-transform: none; letter-spacing: 0; }
    .fine, .fine li     { font-size: 11px !important; line-height: 1.3 !important; text-transform: none; letter-spacing: 0; }
    .sup                { font-size: 10px !important; line-height: 1.0 !important; text-transform: none; letter-spacing: 0; vertical-align: top; margin-top: -.05em; }
        h1 .sup         { font-size: 14px !important; }

    /* article */
    .article p, .article li          { font-size: 18px; line-height: 1.333333; }
    .article .fine      { color: #999; }

    /* additional font styles, sizes and line heights */
    .lead               { font-weight: bold; }
    #product_buy_info .h2
                        { line-height: 0 !important; }


    /* image replacement */
    /* .phark */


/*** default spacing ***/
h1, h2, h3, h4, h5, h6, p, ul, ol, dl, blockquote { padding-top: 10px; padding-bottom: 10px; }
li h1, li h2, li h3, li h4, li h5, li h6, li p, li ul, li ol, li dl, li blockquote,
/*p+p,
h2+p, h3+p, h4+p, h5+p, h6+p,
/*h2+ul, h3+ul, h4+ul, h5+ul, h6+ul,
h2+ol, h3+ol, h4+ol, h5+ol, h6+ol,
h2+dl, h3+dl, h4+dl, h5+dl, h6+dl */{ padding-top: 0; }

/* article spacing */
.article p  { padding: 12px 0; }
.article h2 { padding-top: 20px; }
.article h3 { padding-top: 15px; padding-bottom: 5px; }
.article h4 { padding-bottom: 5px; }


/** COLORS **/
body            { color: #361f11; }
.clr_w          { color: white;   }
.clr_b          { color: black;   }
.clr_def        { color: #361f11; } /* tamno smeđa (logo) */
.clr_meta       { color: #ced7c4; } /* zelena */
    .invert     { color: #ced7c4; }
.clr_note       { color: #e8e3dd; } /* siva (pozadina) */
.clr_dist       { color: #e96153; } /* narančasta (logo) */
.clr_err        { color: #cc3333; }


/** LINKS **/
a { text-decoration: none; color: #e96153; }
a:active, a:hover, a:focus { color: black; text-decoration: underline; }
a:active { outline: none; }
a.lnk_suppress { text-decoration: none; }

    a.clr_b     { color: black; }
    a.clr_b:hover, a.clr_b:focus, a.clr_b:active
                { color: #e96153; }

    a.clr_note,
        .media a.link
                { color: #e8e3dd; }
    a.clr_note:hover, a.clr_note:focus, a.clr_note:active
                { color: #e96153; }
        .media a.link:hover, .media a.link:focus, .media a.link:active
                { color: #e8e3dd; }

    .media a.link { display: block; line-height: 10px; }
        .media a.link .title {
            opacity: 0;
            filter: alpha(opacity = 0);
            -moz-transition: all .5s ease; -webkit-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease;
        }
            .media a.link:hover .title, .media a.link:focus .title, .media a.link:active .title {
                filter: alpha(opacity = 100);
                opacity: 1;
            }

        .media .sticker.logo /* extends .phark */
        {
            display: block; width: 116px; height: 116px; position: absolute; top: -104px; left: 50%; margin-left: -58px; background-image: url(cssimg/ico/logo.png);
        }


/*.article a { color: #ec2028; }
a[rel="external"] { padding-right: 12px; background: url(cssimg/lnk_external.png) no-repeat right center; }
    .ie7 a[rel="external"] { padding-right: 0; background: transparent; }

a.lnk_top { padding: 3px 22px 3px 0; font-size: 10px; color: #ccc; background: url(cssimg/lnk_top.png) no-repeat right center; }
*/
    #header .sticker /* extends .phark */
        {
            display: block; width: 200px; height: 200px; padding: 0; position: absolute; top: 71px;
            -moz-transition: all .6s ease; -webkit-transition: all .6s ease; -o-transition: all .6s ease; transition: all .6s ease;
            backface-visibility: hidden; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden;
        }

        #header .sticker.logo       { left: 109px; background-image: url(cssimg/logo/dobri_buvljak.png); }
            #header .sticker.logo:hover, #header .sticker.logo:focus, #header .sticker.logo:active
                {
                    -moz-transform: rotate(4deg); -webkit-transform: rotate(4deg); -o-transform: rotate(4deg); transform: rotate(4deg);
                    backface-visibility: hidden; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden;
                }
        #header .sticker.badge      { left: 389px; background-image: url(cssimg/logo/badge.png); }
            #header .sticker.badge:hover, #header .sticker.badge:focus, #header .sticker.badge:active
                {
                    -moz-transform: rotate(-4deg); -webkit-transform: rotate(-4deg); -o-transform: rotate(-4deg); transform: rotate(-4deg);
                    backface-visibility: hidden; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden;
                }
        #header .sticker.bosko      { left: 671px; background-image: url(cssimg/logo/bosko.png); }
            #header .sticker.bosko:hover, #header .sticker.bosko:focus, #header .sticker.bosko:active
                {
                    -moz-transform: rotate(4deg); -webkit-transform: rotate(4deg); -o-transform: rotate(4deg); transform: rotate(4deg);
                    backface-visibility: hidden; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden;
                }

    #video_container .sticker.badge /* extends .phark */
        {
            display: block; width: 100px; height: 100px; position: absolute;
            z-index: 101;
            background-image: url(cssimg/ico/video_badge.png);
        }

.pagination { font-size: 20px; padding-top: 30px; padding-bottom: 20px; clear: both; }
    .pagination a, .pagination strong, .pagination span { vertical-align: middle; display: inline-block; _display: inline; *display: inline; zoom: 1; margin-left: 2px; margin-right: 2px; line-height: 35px !important; padding: 0 !important; }
    .pagination a { text-decoration: none !important; }
        .pagination a:hover, .pagination a:focus { background-position: 0 -100px !important; color: #fff !important; }


.breadcrumbs {  }
    .breadcrumbs a { display: inline-block; *display:inline; zoom:1; vertical-align: middle; font-size: 11px; color: #aaa; border: 1px solid #ccc; padding: .4em .7em; -moz-border-radius: 20em; -webkit-border-radius: 20em; border-radius: 20em; text-decoration: none; }
    .breadcrumbs a:hover, .breadcrumbs a:focus { color: #666; border-color: #ccc; }

.lnk_burza { background: url(cssimg/logo/burza.png) no-repeat right center; padding-right: 35px; }
.lang_en { padding-right: 20px; background: transparent url(http://www.dobribuvljak.com/css/site/cssimg/ico/lang_en.png) no-repeat right center; }
.lang_hr { padding-right: 20px; background: transparent url(http://www.dobribuvljak.com/css/site/cssimg/ico/lang_hr.png) no-repeat right center; }

/* Admin link */
.lnk_edit { padding: 2px 12px 4px; position: absolute; left: -4.5em; top: 3em;
    font-size: 15px; font-weight: bold; background: #666; color: #fff;
    -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; }
    .lnk_edit:hover { text-decoration: none; background: #ec2028; }


/**
06/CONTENT
=====================================================================**/
/** LISTS **/
li { list-style-image: none; list-style-position: outside; list-style-type: none; }
    ul.data li, ol.data li              { margin-left: 30px; }
        ul.data_alt li, ol.data_alt li  { margin-left: 10px; }
    .article li                         { margin-left: 40px; padding-bottom: 10px; }
        .article li li                  { margin-left: 20px; }

    ul.data li, ol.data li ul li, .article ul li, .article ol ul li { position: relative; list-style-type: none; *list-style-type: disc; }
        ul.data li:before, ol.data li ul li:before, .article ul li:before, .article ol ul li:before { content: "•"; position: absolute; top: 0; left: -1em; font-size: 1em; color: #c00; }
            ul.data_alt li:before, ol.data_alt li ul li:before { left: -.7em; color: #666; }
    ol.data li, ul.data li ol li, .article ol li, .article ul ol li { list-style-type: decimal; }

    .article ol ul, .article ul ol, .article ul ul, .article ol ol { padding-top: 10px; padding-bottom: 0; }

    .flat { overflow: hidden; _zoom:1; }
        .flat li, .flat .item { float: left; _display:inline; padding-right: 10px; margin-left: 0; }

        .flat_ext {  } /* extends .flat */
            .flat_ext li, .flat_ext .item { border-right: 1px solid #000; padding-left: 10px; }
                .flat_ext li.last, .flat_ext .item.last { border-right: none; }


/* inline definition list */
.line {  }
    .line dt { float: left; clear: left; padding-right: 10px; *display:none; }
    .line dd { float: left; clear: right; *float:none; }


/** MEDIA LISTINGS **/

/* article */
.item_article { line-height: 0 !important; }


/** NAVIGATION **/
.nav_primary {
        position: absolute; top: 310px; left: 40px; float: left; width: 900px; height: 50px; *zoom:1;
    }
    .nav_primary li     { height: 50px; float: left; }
    .nav_primary a      { display: block; height: 50px; padding-left: 15px; padding-right: 15px; background-position: 15px 0; }
        .nav_primary a.nav_buy          { background-image: url(cssimg/nav/biraj.png); width: 130px; }
        .nav_primary a.nav_donate       { background-image: url(cssimg/nav/doniraj.png); width: 190px; }
        .nav_primary a.nav_blog         { background-image: url(cssimg/nav/blog.png); width: 125px; }
        .nav_primary a.nav_associations { background-image: url(cssimg/nav/udruge.png); width: 180px; }
        .nav_primary a.nav_info         { background-image: url(cssimg/nav/info.png); width: 115px; }

        .nav_primary a:hover, .nav_primary a:focus, .nav_primary a:active { background-position: 15px -50px !important; }
        .nav_primary .current a         { background-position: 15px -100px; }

    /* IE7 nav_primary fixes */
    .ie7 .nav_primary { overflow: hidden; }
        .ie7 .nav_primary li { float: left; }

.nav_filtering              {  }
    .nav_filtering .item    { font-size: 18px; line-height: 1.0; letter-spacing: -.01em; }
    .nav_filtering a        { display: block; color: #361f11; padding: 9px 10px 9px 50px; }
        .nav_filtering a:hover, .nav_filtering a:focus, .nav_filtering a:active
                            { color: #e96153; text-decoration: none; }
    .nav_filtering .current a
                            { color: #e96153; background: url(cssimg/ico/filter_dot.png) no-repeat 24px 8px; }

.nav_secondary { padding: 0; padding-top: 10px; text-align: center; }
    .nav_secondary li { margin: 0 5px; display: inline-block; *display: inline; zoom:1; }
    .nav_secondary a { display: block; height: 30px; text-indent: -9999px; outline: 0; }
        .nav_secondary .current a { background-position: left bottom; }
        .nav_secondary a:hover { background-position: left center; }
        .nav_secondary a.nav_o_buvljaku { width: 227px; background-image: url(cssimg/nav/sub_o_buvljaku_v-2.png); }
        .nav_secondary a.nav_bosko      { width: 152px; background-image: url(cssimg/nav/sub_bosko_v-2.png); }
        .nav_secondary a.nav_udruge     { width: 100px; background-image: url(cssimg/nav/sub_udruge_v-2.png); }
        .nav_secondary a.nav_kontakt    { width: 159px; background-image: url(cssimg/nav/sub_kontakt_v-2.png); }

/** FORMS **/
legend  {  }
.fm_field { padding-top: 5px; padding-bottom: 5px; }
    .fm_field ul { padding-top: 0; padding-bottom: 0; }
.fm_req { font-weight: bold; font-style: italic; color: red; position: absolute; left: -0.1em; top: .7em; }
    .label_r .fm_req { position: static; }
.placeholder { color: #aaa !important; }
.fm_desc { font-size: 12px; font-style: italic; line-height: 1.1; color: #999; padding: 5px 10px; }

/* Label */
label { padding: 8px 10px 7px; position: relative; font-size: 14px; line-height: 1.28571; display: block; vertical-align: middle; color: #999; }
    label[for] { cursor: pointer; }
    .label_r label { text-align: right; padding-left: 0; padding-right: 0; }
    .label_l label { text-align: left; }
    .fm_field li label, .fm_field_multi label[for] { text-align: left; }
    .fm_field li label { padding: 3px 0; }

/* Main form elements */
input[type="text"], input[type="password"], .jHtmlArea iframe,
textarea, select {
    width: 100%; padding: 7px 10px; font-size: 13px; line-height: 1; color: #666; text-shadow: 0px 1px 0px white;
    background: #fafafa; border: 1px solid #ccc;
    -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;
    -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; *behavior: url(http://www.dobribuvljak.com/javascript/lib/boxsizing.htc);
    -moz-box-shadow: inset 0px 0px 3px #e6e6e6; -webkit-box-shadow: inset 0px 0px 3px #e6e6e6; box-shadow: inset 0px 0px 3px #e6e6e6;
}
textarea, .jHtmlArea iframe { line-height: 1.3; }

/* Large inputs */
/*
input[type="text"].fm_l, input[type="password"].fm_l, textarea.fm_l {
    padding: 15px 20px; font-size: 24px;
    background: #f2f2f2 url(cssimg/bg/fm_el.png) repeat-x left top; border-color: #eaeaea;
    -moz-box-shadow: inset 0px 2px 3px #ccc; -webkit-box-shadow: inset 0px 2px 3px #ccc; box-shadow: inset 0px 2px 3px #ccc;
}
*/

/* Focus states for default elements */
input[type="text"]:focus, input[type="password"]:focus, input[type="file"]:focus,
textarea:focus, select:focus { border-color: #edc67b; background-color: #fff; color: #66668e; }

/* Focus states for other elements */
/*
input[type="text"].fm_l:focus, input[type="password"].fm_l:focus, textarea.fm_l:focus {
    background-color: #f2f2f2;
}
*/

/* Error styles */
.fm_error {  }
    .fm_error label { color: #cc3300; }
    .fm_error input[type="text"], .fm_error input[type="password"], .fm_error input[type="file"],
    .fm_error textarea, .fm_error select {
        border-color: #cc3300; background: #fffffa; color: #cc3300;
        -webkit-box-shadow: 0 0 3px red; -moz-box-shadow: 0 0 3px red; -ms-box-shadow: 0 0 3px red; box-shadow: 0 0 3px red;
    }
    .fm_error_msg { padding: 3px 0px; color: #cc3300; font-weight: bold; }
        .fm_field .fm_error_msg { padding: 3px 10px; }
        .fm_error_msg li { font-size: 14px; line-height: 1.28571; }
    form > .fm_error_msg { margin-bottom: 20px; padding: 10px; background: #cc3300; color: #fff; }

    .fm_error input[type="text"]:focus, .fm_error input[type="password"]:focus, .fm_error input[type="file"]:focus,
    .fm_error textarea:focus, .fm_error select:focus {
        border-color: #f19c51; background: #fffffa;
    }

/* Other form styles */
.fm_search { position: relative; zoom:1; *width: 280px !important; }
    .fm_search button { position: absolute; top: 50%; right: 24px; margin-top: -13px; *margin-top: -15px; background: transparent; }
    .fm_search button:hover, button:focus { background-color: transparent; }

.fm_disable_images {  }
    .fm_disable_images .add_image { display: none; }

input.fm_trans {
    color: #9b9b9b; text-shadow: 0px 1px 0px #222; border-color: #333 #666 #666 #333; background: transparent;
    -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px;
    -webkit-box-shadow: none; -moz-box-shadow: none; -ms-box-shadow: none; box-shadow: none;
}

    input.fm_trans:focus { color: #fff; border-color: #333 #666 #666 #333; background: #5c5c5c; background: rgba(255,255,255,0.15); }

/* BUTTONS */
button, .btn { display: inline-block; vertical-align: middle; color: #fff;
    font-size: 22px; font-weight: bold; line-height: 1; letter-spacing: -.03em; text-transform: uppercase; text-decoration: none !important;
    /*
    border: 1px solid #9d0a0e; color: #e5e5e5; background: #db2b25 url(cssimg/btn/def.png) repeat-x left center; text-shadow: 0 1px 2px #8c0405;
    -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;
    -moz-box-shadow: 0px 2px 3px #444; -webkit-box-shadow: 0px 2px 3px #444; box-shadow: 0px 2px 3px #444;
    */
    background-color: #f36a57;
    }
button, a.btn { cursor: pointer; }
button { width: auto; overflow: visible; }
    .ie7 button { display: inline; zoom: 1; }
button::-moz-focus-inner { padding: 0; border: 0; }
    button span, .btn span { padding: .6em 1em; display: block; text-align: center; }
    .ie7 button span { border: none; }
button:hover, button:focus, a.btn:hover, a.btn:focus { color: #fff; background-color: #361f11; }
button[disabled], .btn_disabled, .btn_disabled:hover, .btn_disabled:focus { border-color: #999 !important; background: #ccc !important; text-shadow: 1px 1px 0 #fff !important; color: #a0a0a0 !important; cursor: default !important; }
    button[disabled] span, .btn_disabled span, .btn_disabled:hover span, .btn_disabled:focus span { border-color: #fff #fff #bbb !important; }

    .btn_full /* extends .btn */
        { display: block; text-align: center; }


    /* coloring - extends .btn */
    .btn_meta   { background-color: #ced7c4; }
    .btn_note   { background-color: #e8e3dd; }
    .btn_def    { background-color: #361f11; }
    .btn_b      { background-color: black; }
    .btn_fbook  { background-color: #3b5998; }

    /* sizes - extends .btn */
    .btn_large  {  font-size: 36px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; }
    .btn_mini   {  font-size: 12px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; }
    .btn_micro  {  font-size: 10px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; }


/** TABLES **/
table { width: 100%; margin-top: 20px; margin-bottom: 20px; }
table + table { margin-top: 30px; }
caption { display: none; }
.data th, .article th, .data td, .article td { vertical-align: bottom; text-align: left; padding-left: 20px; padding-right: 20px; font-size: 15px; line-height: 1.4; }
    .data th, .article th, .article thead td { border-bottom: 1px solid #d0d0d0; padding-bottom: 10px; }
    .data td, .article td { padding-top: 10px; }
    /*.data tfoot td { background: #f5f5f5; border-bottom: none; }*/

    .data_alt th, .data_alt td  { vertical-align: top; }
    .data_alt tbody th          { padding-top: 25px; padding-bottom: 5px; font-size: 14px; border-bottom-color: #eee; color: #000; }



/** TITLES, LINKS - extends .phark **/
/* filtering titles */
#filtering .hd                  { background-image: url(cssimg/hd/filtering_v-1.png); }
#filtering .hd_search           { height: 45px; background-position: 0 0; }
#filtering .hd_categories       { height: 40px; background-position: 0 -100px; }
#filtering .hd_price            { height: 40px; background-position: 0 -200px; }
#filtering .hd_status           { height: 40px; background-position: 0 -300px; }

/* page and sections titles */
.phark.title_s                  { height: 35px; display: inline-block; vertical-align: top; background-image: url(cssimg/hd/titles_s_v-2.png); }
    .phark.title_s.more         { width: 115px; background-position: 0 0; }
    .phark.title_s.read         { width: 100px; background-position: 0 -50px; }
    .phark.title_s.association  { width: 150px; background-position: 0 -100px; }
    .phark.title_s.more_associations
                                { width: 200px; background-position: 0 -150px; }
    .phark.title_s.buy          { width: 52px; background-position: 0 -200px; }

.phark.title_m                  { height: 40px; display: inline-block; vertical-align: top; background-image: url(cssimg/hd/titles_m_v-4.png); }
    .phark.title_m.new_on_site  { width: 180px; background-position: 0 0; }
    .phark.title_m.new_on_blog  { width: 300px; background-position: 0 -50px; }
    .phark.title_m.association_buy
                                { width: 380px; background-position: 0 -100px; margin: 0 auto; }
    .phark.title_m.association_bought
                                { width: 380px; background-position: 0 -150px; margin: 0 auto; }
    .phark.title_m.association_help
                                { width: 355px; height: 50px; background-position: 0 -200px; margin: 0 auto; }
    .phark.title_m.association_product_donated
                                { width: 235px; background-position: 0 -250px; margin: 0 auto; }
    .phark.title_m.association_product_bought
                                { width: 225px; background-position: 0 -300px; margin: 0 auto; }
    .phark.title_m.associations { width: 215px; height: 50px; background-position: 0 -350px; margin: 0 auto; }
    .phark.title_m.blog         { width: 205px; height: 50px; background-position: 0 -400px; margin: 0 auto; }
    .phark.title_m.choose       { width:  70px; height: 50px; background-position: 0 -450px; margin: 0 auto; }
    .phark.title_m.awards       { width: 100px; height: 50px; background-position: 0 -500px; margin: 0 auto; }
    .phark.title_m.for_associations
                                { width: 130px; height: 40px; background-position: 0 -550px; margin: 0 auto; }
    .phark.title_m.for_all      { width: 90px; height: 40px; background-position: 0 -600px; margin: 0 auto; }
    .phark.title_m.association  { width: 195px; background-position: 0 -650px; margin: 0 auto; }
    .phark.title_m.product      { width: 185px; background-position: 0 -700px; margin: 0 auto; }
    .phark.title_m.all_associations
                                { width: 185px; height: 50px; background-position: 0 -750px; margin: 0 auto; }
    .phark.title_m.latest       { width: 150px; height: 50px; background-position: 0 -800px; margin: 0 auto; }

.phark.title_l                  { display: inline-block; vertical-align: top; background-image: url(cssimg/hd/titles_l_v-6.png); }
    .phark.title_l.how_to_buy   { height: 40px; width: 300px; background-position: 0 0; }
    .phark.title_l.contact      { height: 48px; width: 300px; background-position: 0 -100px; }
    .phark.title_l.hi_score     { height: 42px; width: 300px; background-position: 0 -200px; }
    .phark.title_l.related_blogs
                                { height: 60px; width: 300px; background-position: 0 -300px; }
    .phark.title_l.want_to_buy  { height: 40px; width: 300px; background-position: 0 -400px; margin-left: 38px; }
    .phark.title_l.want_to_sell { height: 40px; width: 305px; background-position: 0 -500px; margin-left: 57px; }



/** ICONS **/
/* dots */
.icon.dot                       { width: 35px; height: 35px; display: inline-block; vertical-align: top; background-image: url(cssimg/ico/dots.png); }
    .icon.dot.dot_w             { background-position: 0 0; }
    .icon.dot.dot_b             { background-position: 0 -50px; }
    .icon.dot.dot_def           { background-position: 0 -100px; } /* tamno smeđa (logo) */
    .icon.dot.dot_meta          { background-position: 0 -150px; } /* zelena */
    .icon.dot.dot_note          { background-position: 0 -200px; } /* siva (pozadina) */
    .icon.dot.dot_dist          { background-position: 0 -250px; } /* narančasta (logo) */

    /* media icons */
    .media .icon.dot            { position: absolute; top: 15px; right: 25px; z-index: 3; }
    .icon.dot.dot_reserved      { background-position: -50px -150px; } /* zelena */
    .icon.dot.dot_sold          { background-position: -50px -200px; } /* siva (pozadina) */



/* arrows for prev-next links */
.icon.arrow_s                   { width: 35px; height: 35px; display: inline-block; vertical-align: top; background-image: url(cssimg/ico/arrows_s.png); }
    .icon.arrow_s.prev          { background-position: 0 0; }
        a:hover .icon.arrow_s.prev, a:focus .icon.arrow_s.prev, a:active .icon.arrow_s.prev,
        a.icon.arrow_s.prev:hover, a.icon.arrow_s.prev:focus, a.icon.arrow_s.prev:active
                                { background-position: 0 -50px; }
    .icon.arrow_s.next          { background-position: -50px 0; }
        a:hover .icon.arrow_s.next, a:focus .icon.arrow_s.next, a:active .icon.arrow_s.next,
        a.icon.arrow_s.next:hover, a.icon.arrow_s.next:focus, a.icon.arrow_s.next:active
                                { background-position: -50px -50px; }

.icon.arrow_l                   { width: 80px; height: 80px; display: inline-block; vertical-align: top; background-image: url(cssimg/ico/arrows_l.png); }
    .icon.arrow_l .ring         { display: none; width: 80px; height: 80px; position: absolute; left: 0; top: 0; background: url(cssimg/bg/ring.png) no-repeat -1px -1px; }
    .icon.arrow_l:hover .ring   { display: block; }

        .icon.arrow_l.prev          { background-position: 0 0; }
        .icon.arrow_l_img.prev img
                                { display: none; }
        a.icon.arrow_l.prev:hover, a.icon.arrow_l.prev:focus, a.icon.arrow_l.prev:active
                                { background-position: 0 -100px; }
        a.icon.arrow_l_img.prev:hover, a.icon.arrow_l_img.prev:focus, a.icon.arrow_l_img.prev:active
                                { background-image: none; }
        a.icon.arrow_l_img.prev:hover img, a.icon.arrow_l_img.prev:focus img, a.icon.arrow_l_img.prev:active img
                                { display: block; }

    .icon.arrow_l.next          { background-position: -100px 0; }
        .icon.arrow_l_img.next img  { display: none; }
        a.icon.arrow_l.next:hover, a.icon.arrow_l.next:focus, a.icon.arrow_l.next:active
                                { background-position: -100px -100px; }
        a.icon.arrow_l_img.next:hover, a.icon.arrow_l_img.next:focus, a.icon.arrow_l_img.next:active
                                { background-image: none; }
        a.icon.arrow_l_img.next:hover img, a.icon.arrow_l_img.next:focus img, a.icon.arrow_l_img.next:active img
                                { display: block; }

    .ie7 .icon.arrow_l_img.prev img, .ie8 .icon.arrow_l_img.prev img,
    .ie7 .icon.arrow_l_img.next img, .ie8 .icon.arrow_l_img.next img,
    .ie7 .icon.arrow_l .ring, .ie8 .icon.arrow_l .ring
    { display: none !important; }

    .ie7 a.icon.arrow_l_img.prev:hover, .ie7 a.icon.arrow_l_img.prev:focus, .ie7 a.icon.arrow_l_img.prev:active,
    .ie8 a.icon.arrow_l_img.prev:hover, .ie8 a.icon.arrow_l_img.prev:focus, .ie8 a.icon.arrow_l_img.prev:active
        { background-image: url(cssimg/ico/arrows_l.png); background-position: 0 -100px; }

    .ie7 a.icon.arrow_l_img.next:hover, .ie7 a.icon.arrow_l_img.next:focus, .ie7 a.icon.arrow_l_img.next:active,
    .ie8 a.icon.arrow_l_img.next:hover, .ie8 a.icon.arrow_l_img.next:focus, .ie8 a.icon.arrow_l_img.next:active
        { background-image: url(cssimg/ico/arrows_l.png); background-position: -100px -100px; }



/** MISC **/
hr, .hr { border: none; border-top: 1px solid #ccc; border-bottom: 1px solid white; padding: 0; margin: 10px 0; }
.article object, .article embed, .article iframe { display: block; padding: 5px 0; }


/* mascot */
#header .mascot                     { display: none; }
    .body_overview #header .mascot  { display: block; }

#header .mascot /* extends .phark */
    { width: 260px; height: 180px; position: absolute; left: 85px; top: 440px; z-index: 2; }

    body#body_homepage #header .mascot     { background-image: url(cssimg/bosko/bosko_homepage_v-1.png); }
    body#body_products #header .mascot     { background-image: url(cssimg/bosko/bosko_homepage_v-1.png); /*left: 17px;*/ }
    body#body_articles #header .mascot     { background-image: url(cssimg/bosko/bosko_blog_v-1.png); left: 17px; height: 200px; top: 421px; }
    body#body_associations #header .mascot { background-image: url(cssimg/bosko/bosko_homepage_v-1.png); }

    /*#content  .mascot.legs                  { height: 40px; top: auto; bottom: -40px; background-image: url(cssimg/bosko/bosko_legs.png) !important; }*/

    .bg_bosko_pencil { background: url(cssimg/bosko/bosko_pencil.png) no-repeat right bottom; padding-right: 330px; min-height: 350px; }

/* lamps */
#header .lamps
    {
        width: 1420px; height: 100px; position: absolute; left: 50%; top: 378px; margin-left: -710px; overflow: hidden;
        background-image: url(cssimg/bg/lamps.png); z-index: 2;
    }

/* view video */
#video_container            { position: absolute; left: 0; top: 325px; width: 100%; min-width: 980px; height: 100px; z-index: 50; text-align: center; }
    #video                  { height: 459px; margin: 0 auto; top: 60px; }
    .bg_video               { background: url(cssimg/bg/video.jpg) 0 0 no-repeat; }


.nav_primary                { z-index: 100; }
#video_container[style]     { overflow: visible !important; }

#video_container .video, #video_container .video_t { display: none; }
    .body_overview #video_container .video, .body_overview #video_container .video_t { display: block; }

#video_container .video /* extends .phark */
    {
        width: 80px; height: 175px; position: absolute; left: 50%; bottom: -149px; margin-left: 276px;
        background-image: url(cssimg/ico/video_v-2.png); background-position: 0 0; z-index: 60;

    }
    #video_container .video.active { background-position: -100px 0; }
    #video_container .video_t
    {
        width: 32px; height: 28px; position: absolute; left: 50%; bottom: 20px; margin-left: 305px;
        background: url(cssimg/ico/video_t.png) 0 0 no-repeat; z-index: 60;
    }

    #video_container .video:hover/*, #video_container .video:focus*/, #video_container .video:active
    {
        -moz-transition: -moz-transform .6s ease; -webkit-transition: -webkit-transform .6s ease; -o-transition: -o-transform .6s ease; transition: transform .6s ease;
        -moz-transform: rotate(4deg) translate(-6px); -webkit-transform: rotate(4deg) translate(-6px); -o-transform: rotate(4deg) translate(-6px); transform: rotate(4deg) translate(-6px);
    }


/* site teaser texts */
#site_teaser                    { width: 440px; position: absolute; top: 505px; left: 280px; display: none; }
    .body_overview #site_teaser { display: block; }


/* PRODUCT */
/* how to buy info */
#product_buy_info li            { padding-bottom: 15px !important; }
#product_buy_info .info         { position: relative; top: -7px; }



/* view more */
/*
#content .more /* extends .ir *//*
{ display: block; width: 110px; height: 130px; position: absolute; right: 75px; bottom: -130px; z-index: 2; }

    #content .more_t
    {
        display: block; width: 110px; height: 130px; position: absolute; right: 0; top: 0;
        background: url(cssimg/ico/more.png) 0 0 no-repeat; z-index: 3;
        -moz-transition: all .6s ease; -webkit-transition: all .6s ease; -o-transition: all .6s ease; transition: all .6s ease;
    }

    #content .more_b
    {
        display: block; width: 190px; height: 70px; position: absolute; right: -40px; top: 160px;
        background: url(cssimg/ico/more_b.png) 0 0 no-repeat; z-index: 3;
        -moz-transition: all .6s ease; -webkit-transition: all .6s ease; -o-transition: all .6s ease; transition: all .6s ease;
    }

    #content .more:hover .more_t, #content .more:focus .more_t, #content .more:active .more_t
    { -moz-transform: rotate(-6deg) translate(8px,1px); -webkit-transform: rotate(-6deg) translate(8px,1px); -o-transform: rotate(-6deg) translate(8px,1px); transform: rotate(-6deg) translate(8px,1px); }

    #content .more:hover .more_b, #content .more:focus .more_b, #content .more:active .more_b
    { -moz-transform: translate(8px); -webkit-transform: translate(8px); -o-transform: translate(8px); transform: translate(8px); }
*/
/* editor-specific */
body.iframe_article { text-align: left; width: 620px; margin: 0 auto; padding: 0; background: #fcfcfc; }
body.iframe_article_g5 { text-align: left; width: 270px; margin: 0 auto; padding: 0; background: #fcfcfc; }


/* Article images */
.img_holder { display: block; }
    .img_holder img { display: block; }

.article img {  }
    p.left > img, p.right > img { margin-left: 0; }
    .article .left { margin: 20px 20px 20px 0; }
    .article .right { margin: 20px 0 20px 20px; }
/*.article p img:first-child { margin-left: 0; }*/

abbr, acronym { border-bottom: 1px dotted #5a6768; cursor: help; }
acronym { speak: normal; }
abbr.initialism { speak: spell-out; }
abbr.truncation { speak: normal; }

.skipper { padding: 0; } /* used for skip links at the top and bottom */
    .skipper li { line-height: 0; }
    .skipper a { position: absolute; top: 0; left: -9999px; z-index: 100; width: 100%; font-size: 15px; }
    .skipper a:focus,
    .skipper a:active { display: block; position: absolute; top: 0; left: 0; width: 100%; padding: 1.1em 0; font-weight: bold; color: white; background: #ec2028; text-align: center; text-transform: uppercase; outline: 0; }

#devinator { width: 10em; position: fixed; z-index: 500; left: 0; top: 0; padding: .5em 0; background: rgba(0, 0, 0, 0.5); font-family: Consolas, Monaco, Menlo, sans-serif; }
    #devinator ul { padding: 0; }
    #devinator a { color: white; display: block; font-size: 12px; padding: .25em 1em; text-shadow: #000 0px 0px 2px; }
    #devinator a:hover { font-weight: bold; text-decoration: none; background: rgba(255, 255, 255, 0.3); }


.product_title { width: 680px; }

@-moz-document url-prefix() {
    #product_buy_info li        { padding-bottom: 5px !important; }
}