/* *** COMPONENTS *** */
.red_box, .blue_box {
    position: absolute;
    background-image: url(../images/diagram/diagram_grafika2.png);
    background-repeat: no-repeat;
    width: 43px;
    height: 26px;
    text-align: center;
    padding: 9px 0 8px 0;
    font-family: Arial, sans-serif;
    font-weight: bold;
    font-size: 21px;
}
.red_box {
    background-position: 0px 0px;
    color: #ffffff;
}
.blue_box {
    background-position: -43px 0px;
    color: #ffffff;
}
.white_box {
    position: absolute;
    background-image: url(../images/diagram/diagram_grafika2.png);
    background-repeat: no-repeat;
    width: 42px;
    height: 19px;
    text-align: center;
    padding: 18px 0 6px 1px;
    font-family: Arial, sans-serif;
    font-weight: bold;
    font-size: 18px;
    background-position: -86px 0px;
    color: #316bac;
}


.csap_text {
    font-size: 10px;
    color: #000;
    text-align: center;
    height: 13px;
}
.csap_bar {
    margin: 0 auto;
    width: 10px;
    font-size: 1px;
    background: #236ec1;
}

.szel_text {
    font-size: 10px;
    color: #000;
    text-align: center;
    height: 13px;
}
.szel_bar {
    margin: 0 auto;
    width: 18px;
    font-size: 1px;
    background: #ffffff;
    border: 1px solid #333333;
}

/* *** 15 NAPOS DIAGRAM *** */
#diagram {
    width: 716px;
    padding: 5px;
}
#diagram td.legend {
    vertical-align: top;
    width: 26px;
    background: #dadada;
}
#diagram td.legend div {
    font-size: 1px;
    padding: 0;
}


#diagram tr.bar td {
    width: 45px;
}
#diagram tr.bar.odd td.bar {
    background: #f2f2f2;
}
#diagram tr.bar td.bar.week_0 {
    background: #ffe5e5;
}
#diagram tr.bar.odd td.bar.week_0 {
    background: #f3d9d9;
}





#diagram td.bar {
    vertical-align: top;
    border-left: 1px solid #ffffff;
    width: 45px;
}
#diagram td.legend .datum {
    width: 26px; height: 46px;
    background: #ffffff;
}
#diagram td.bar .datum {
    width: 45px; height: 45px; padding: 0 0 1px 0; /* height: 49px; */
    background: #ffffff;
    text-align: center;
    font-size: 11px;
    background: url(../images/diagram/diagram_honap.gif) top left no-repeat;
}

#diagram td.odd .datum {
    /* background: url(../images/diagram/diagram_honap.gif) top left no-repeat; */
}

#diagram td.bar .datum_ho { font-size: 10px; color: #666; }
#diagram td.bar .datum_nap { font-size: 16px; color: #333; font-weight: bold; line-height: 21px; }
#diagram td.bar .datum_hetnap { font-size: 9px; color: #333; line-height: 6px; }
#diagram td.week_0 .datum .datum_nap, #diagram td.week_0 .datum .datum_hetnap  { color: #CC0000; }
#diagram td.week_6 .datum .datum_nap, #diagram td.week_6 .datum .datum_hetnap { color: #666666; }




#diagram td.legend .egkep {
    width: 26px; height: 52px;
    background: url(../images/diagram/legend.png) no-repeat -26px -20px;
}
#diagram td.legend .egkep .egkep_c {
    width: 26px; height: 52px;
    background: url(../images/diagram/dia_legend_corner.gif) no-repeat top left;
}
#diagram td.bar .egkep {
    width: 45px; height: 52px;
    background: url(../images/diagram/dia_normal_back.png) repeat-y 0px 0px;
}
#diagram td.bar .egkep .egkep_c {
    width: 45px; height: 42px; padding: 5px 0; /* height: 52px; */
    background: url(../images/diagram/dia_bar_corner.gif) no-repeat top left;
    text-align: center;
}

#diagram td.bar .egkep .egkep_c img { width: 42px; height: 41px; border: 0; }

#diagram td.legend .homax {
    width: 26px; padding: 10px 0 0 0;
    background: url(../images/diagram/legend.png) no-repeat left center;
}
#diagram td.legend .homin {
    width: 26px; padding: 0 0 10px 0;
    background: url(../images/diagram/legend.png) no-repeat right center;
}
#diagram td.bar .homerseklet {
    width: 43px; padding: 10px 1px;
    background: url(../images/diagram/dia_normal_back.png) repeat-y 0px 0px;
}

#diagram td.legend .csapadek {
    width: 26px; padding: 5px 0;
    background: url(../images/diagram/legend.png) no-repeat -52px -13px;
}
#diagram td.bar .csapadek {
    width: 45px; padding: 5px 0;
    background: url(../images/diagram/dia_normal_back.png) repeat-y 0px 0px;
}

#diagram td.legend .szelseb {
    width: 26px; padding: 1px 0 10px 0;
    background: url(../images/diagram/legend.png) no-repeat -104px -14px;
}
#diagram td.bar .szelseb {
    width: 45px; padding: 1px 0 10px 0;
    background: url(../images/diagram/dia_normal_back.png) repeat-y 0px 0px;
}

#diagram td.legend .vizhom {
    width: 26px; height: 65px;
    background: url(../images/diagram/legend.png) no-repeat -78px -17px;
}
#diagram td.bar .vizhom {
    width: 45px; height: 45px; padding: 10px 0; /* height: 65px; */
    background: url(../images/diagram/dia_normal_back.png) repeat-y 0px 0px;
}

#diagram td.legend .hirdetes {
    width: 26px; height: 46px;
    background: url(../images/diagram/legend.png) no-repeat -130px -24px;
}
#diagram td.legend .hirdetes .hirdetes_c {
    width: 26px; height: 46px;
    background: url(../images/diagram/dia_legend_corner.gif) no-repeat left bottom;
}
#diagram td.bar .hirdetes {
    width: 45px; height: 46px;
    background: url(../images/diagram/dia_normal_back.png) repeat-y 0px 0px;
}
#diagram td.bar .hirdetes .hirdetes_c {
    width: 45px; padding: 1px 0; height: 44px; /* height: 46px; */
    background: url(../images/diagram/dia_bar_corner.gif) no-repeat left bottom;
}
#diagram td.bar .hirdetes .hirdetes_c img {
    position: absolute;
}

#diagram td.odd .egkep,
#diagram td.odd .homerseklet,
#diagram td.odd .csapadek,
#diagram td.odd .vizhom,
#diagram td.odd .szelseb,
#diagram td.odd .hirdetes {
    background-position: -45px 0px;
}
#diagram td.week_0 .egkep,
#diagram td.week_0 .csapadek,
#diagram td.week_0 .homerseklet,
#diagram td.week_0 .vizhom,
#diagram td.week_0 .szelseb,
#diagram td.week_0 .hirdetes {
    background-image: url(../images/diagram/dia_weekend_back.png);
}

/* *** 3 NAPOS DIAGRAM *** */
#rovid_dia {
    width: 470px;
}
#rovid_dia th {
    height: 20px;
    padding-top: 7px;
    padding-bottom: 1px;
    font-size: 12px;
    font-weight: normal;
    text-transform: uppercase;
}
#rovid_dia td {
    height: 60px;
    border-top: 2px solid #ffffff;
}
#rovid_dia tr.odd td {
    background: #f7f7f7;
}
#rovid_dia tr.even td {
    background: #ececec;
}
#rovid_dia .rovid_start {
    padding-left: 6px;
    font-size: 11px;
}
#rovid_dia .rovid_ikon {
    width: 44px;
    text-align: center;
}
#rovid_dia .rovid_ikon img { width: 42px; height: 41px; border: 0; }

#rovid_dia .rovid_szel {
    width: 38px;
    text-align: center;
}
#rovid_dia .rovid_szel img { width: 35px; height: 35px; border: 0; }

#rovid_dia .rovid_hom {
    width: 48px;
    border-left: 2px solid #ffffff;
    vertical-align: top;
}
#rovid_dia .rovid_hom .red_box, #rovid_dia .rovid_hom .blue_box {
    margin-top: 7px;
    margin-left: 3px;
}

/* *** 5 NAPOS FORECA DIAGRAM *** */
#foreca_dia {
    width: 100%;
}
#foreca_dia th {
    height: 20px;
    padding-top: 7px;
    padding-bottom: 1px;
    font-size: 12px;
    font-weight: normal;
    text-transform: uppercase;
}
#foreca_dia td {
    height: 60px;
    border-top: 2px solid #ffffff;
}
#foreca_dia tr.odd td {
    background: #f7f7f7;
}
#foreca_dia tr.even td {
    background: #ececec;
}
#foreca_dia .foreca_start {
    padding-left: 6px;
    font-size: 11px;
}
#foreca_dia .foreca_ikon {
    width: 44px;
    padding: 0 5px;
    text-align: center;
}
#foreca_dia .foreca_ikon img { width: 42px; height: 41px; border: 0; }

#foreca_dia .foreca_szel {
    width: 38px;
    padding: 0 5px;
    text-align: center;
}
#foreca_dia .foreca_szel img { width: 35px; height: 35px; border: 0; }

#foreca_dia .foreca_hom {
    width: 55px;
    border-left: 2px solid #ffffff;
    vertical-align: top;
}
#foreca_dia .foreca_csap {
    width: 40px;
}

#foreca_dia .foreca_sep {
    width: 15px;
}

#foreca_dia .foreca_hom .red_box, #foreca_dia .foreca_hom .blue_box {
    margin-top: 7px;
    margin-left: 10px;
}

#foreca_dia .foreca_na {
    color: #666666;
    font-size: 10px;
    text-align: center;
    border-left: 2px solid #ffffff;
}