/*
 *	@version 20090814 
 */
body { margin: 0; padding: 0; background: #fff url(main.body.bg.png) top left repeat-x; }
* { margin:0; padding:0 }
.clear { height: 1px; font-size: 1px; clear: both; }

/* Hat */
#hat-container { min-width: 790px; background: url(main.hat.bg.png) center top no-repeat; text-align: center; }
#hat { padding-top: 15px; height: 331px; }
#hat #logo { position: absolute; top: 86px; width: 142px; height: 51px; background: url(main.hat.gif) top left no-repeat; }
#hat #logo h2 a { width: 142px; height: 51px; position: absolute; }
#hat #logo h2 span { display: none; }
#hat #phone { position: absolute; top: 178px; width: 210px; height: 29px; background: url(main.hat.gif) -28px -53px no-repeat; }
#hat #phone h2 { display: none; }
#hat #slogan { position: absolute; top: 220px; width: 255px; height: 43px; background: url(main.hat.gif) 0 -85px no-repeat; }
#hat #slogan h4 { display: none; }
#hat #main-menu-container-0 { background: url(main.main-menu-top.gif) left top no-repeat; }
#hat #main-menu-container-1 { padding-left: 14px; background: url(main.main-menu-both.gif) left bottom no-repeat; }
#hat #main-menu-container-2 { padding: 0; background: url(main.main-menu-both.gif) right bottom no-repeat;  }
#hat #main-menu-container-3 { padding-right: 14px; background: url(main.main-menu-top.gif) right top no-repeat; }
#hat #main-menu-container-4 { padding: 5px 0 5px 0; background-color: #425b1e; }
#hat #main-menu { list-style: none; display: block; text-align: center; }
#hat #main-menu li { display: inline; padding: 5px 10px; }
#hat #main-menu li a { color: #c2c9b6; text-decoration: none; }

/* Content */
#content { padding-bottom: 4em; }
#content .left { width: 210px; float: left; }
#content .right { width: 540px; float: right; }

#content .left .news-header { background: #9e1907 url(main.news-header.gif) top right no-repeat; padding: 1.2em 10px .6em 15px; }
#content .left .info-header { background: #999933 url(main.info-header.gif) top right no-repeat; padding: 1.2em 15px .6em 15px; }
#content .left #main-news { margin: 1.2em 10px;  }
#content .left #main-news dd { margin-bottom: 1.2em; }
#content .left #main-news a { text-decoration: none; color: black; }
#content .left ul { margin: 1.2em 10px; list-style: none; }
#content .left ul li { margin-bottom: 1.2em; }
#content .left #main-articles li { margin-bottom: 0.2em; }
#content .right .txt { margin-top: -50px; }

#content .right .items { list-style: none; }
#content .right .items li { width: 20%; float: left; margin-bottom: 2em; }
#content .right .items li .image { width: 85px; height: 85px; border: 5px solid #EFF7BF; margin-bottom: 5px; }
#content .right .items li .image a { color: #fff; }
#content .right .items li .image img { width: 85px; height: 85px; border: none; }
#content .right .items li .title { background: url(main.hat.gif) 0px -127px no-repeat; padding-left: 17px; clear: both; }
#content .right .items li .price { padding-left: 16px; color: #9E1907; }

#content .right .image { width: 300px; height: 300px; border: 5px solid #EFF7BF; float: left; margin-right: 20px; }
#content .right .image img { width: 300px; height: 300px; }

#content .right .order-header { background: #999933 url(internal.order-header.right.gif) top right no-repeat;  }
#content .right .order-header div { background: url(internal.order-header.left.gif) top left no-repeat; padding: 1.2em 15px .6em 15px; }

#content .right #news {  }
#content .right #news dt { margin: 1.2em 0; }
#content .right #news dd { margin: 1.2em 0; }

/* Order form */
#content .right form fieldset { padding: 10px; border: 0 none; }
#content .right form fieldset legend { display: none; }

#content .right form .container { padding: 4px 10px 4px 35px; }
#content .right form .order-header { margin-top: 1.2em; }
#content .right form .container .radio { margin-left: -25px; height: 1em; border: 0; }
#content .right form .container.piano { background-color: #f6f6f6; }
#content .right form .container.text-block label { display: block; }
#content .right form .container.text-block input, #content .right form .container.text-block textarea { width: 80%; }
#content .right form label { margin: .2em 0; width: 100%; }
* html #content .right form label { position: relative; }  /* IE6 only */
#content .right form label.false { color: #9e1907; }
#content .right form input { margin: .2em 0; border: 1px solid black; padding: 1px; }
#content .right form select { border: 1px solid black; width: auto; }
#content .right form textarea { float: left; margin: .2em 0; border: 1px solid black; width: 68%; position: relative; } /* position: for stupid webkit */
#content .right form input.big, #content .right form select.width { width: 68%; }
#content .right form input.small { width: 5em; }
#content .right form input.h { display: none; }
#content .right form .control { float: left; }
#content .right form .control img { border:1px solid #e5e5e5; margin: 0 35px 0 -25px; vertical-align: middle; }
#content .right form .container.piano .control img { border:1px solid #c5c5c5; }
* html #content .right form .control img, * html #content .right form .container .radio { position: fixed; } /* IE6 only */

#content .right form .price { float: right; display: block; }
#content .right form .price.img { margin-top: 30px; }
#content .right form #sum { float: right; font-size:1.8em; }
#content .right form #sum big { font-size:1.4em; color: #9E1907; }
#content .right form #submit { margin-left: 35px; font-size:1.4em; padding: 2px 10px; }

.ui-datepicker { background-color: #fff; padding: 2px; border: 1px solid black; }
.ui-datepicker-header { background-color: #999933; }
.ui-datepicker-title { text-align: center; font-weight: bold; }
.ui-datepicker-prev { float: left; cursor: pointer; color: #fff; }
.ui-datepicker-next { float: right; cursor: pointer;  color: #fff; }
.ui-datepicker td a { display: block; text-align: right; text-decoration: none; font-weight: bold; }
.ui-state-default { border: 1px solid #ccc; margin: 1px; padding: 1px 2px; text-align: right; }
.ui-state-highlight { background-color: #eee;  }

/*----------------------------------*/
.ui-datepicker { width: 17em; padding: .2em .2em 0; }
.ui-datepicker .ui-datepicker-header { position:relative; padding:.2em 0; }
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position:absolute; top: 2px; width: 1.8em; height: 1.8em; }
.ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; }
.ui-datepicker .ui-datepicker-prev { left:2px; }
.ui-datepicker .ui-datepicker-next { right:2px; }
.ui-datepicker .ui-datepicker-prev-hover { left:1px; }
.ui-datepicker .ui-datepicker-next-hover { right:1px; }
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px;  }
.ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; }
.ui-datepicker .ui-datepicker-title select { float:left; font-size:1em; margin:1px 0; }
.ui-datepicker select.ui-datepicker-month-year {width: 100%;}
.ui-datepicker select.ui-datepicker-month, 
.ui-datepicker select.ui-datepicker-year { width: 49%;}
.ui-datepicker .ui-datepicker-title select.ui-datepicker-year { float: right; }
.ui-datepicker table {width: 100%; font-size: .9em; border-collapse: collapse; margin:0 0 .4em; }
.ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: bold; border: 0;  }
.ui-datepicker td { border: 0; padding: 1px; }
.ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; }
.ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0; }
.ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; }
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float:left; }

/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi { width:auto; }
.ui-datepicker-multi .ui-datepicker-group { float:left; }
.ui-datepicker-multi .ui-datepicker-group table { width:95%; margin:0 auto .4em; }
.ui-datepicker-multi-2 .ui-datepicker-group { width:50%; }
.ui-datepicker-multi-3 .ui-datepicker-group { width:33.3%; }
.ui-datepicker-multi-4 .ui-datepicker-group { width:25%; }
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header { border-left-width:0; }
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width:0; }
.ui-datepicker-multi .ui-datepicker-buttonpane { clear:left; }
.ui-datepicker-row-break { clear:both; width:100%; }

/* RTL support */
.ui-datepicker-rtl { direction: rtl; }
.ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto; }
.ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto; }
.ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto; }
.ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto; }
.ui-datepicker-rtl .ui-datepicker-buttonpane { clear:right; }
.ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; }
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current { float:right; }
.ui-datepicker-rtl .ui-datepicker-group { float:right; }
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header { border-right-width:0; border-left-width:1px; }
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width:0; border-left-width:1px; }

/* IE6 IFRAME FIX (taken from datepicker 1.5.3 */
.ui-datepicker-cover {
    display: none; /*sorry for IE5*/
    display/**/: block; /*sorry for IE5*/
    position: absolute; /*must have*/
    z-index: -1; /*must have*/
    filter: mask(); /*must have*/
    top: -4px; /*must have*/
    left: -4px; /*must have*/
    width: 200px; /*must have*/
    height: 200px; /*must have*/
}

#ui-datepicker-div { display:none; }


/* Footer */
#footer-container { background: url(main.footer.bg.png) left bottom repeat-x; text-align: center; }
#footer-container-img { min-width: 790px; background: url(main.footer-img.bg.png) center bottom no-repeat; text-align: center; }
#footer { padding-bottom: 4em; }
#footer .left { width: 210px; float: left; }
#footer .right { width: 540px; float: right; }
#footer .left #f-phone { margin-top: 30px; width: 220px; height: 29px; background: url(main.hat.gif) 0px -53px no-repeat; }
#footer .left #f-phone h2 { display: none; }


#hat, #content, #footer { width: 790px; text-align: left; margin: 0px auto 0px auto; }

