/*=====================================================
// Version : 1.0
// Project : michel vincent
//=====================================================*/


/* ----- HTML TAG RESET & CLEARFIX ----- */
body,div,dl,dt,dd,ul,ol,li,h1,
h2,h3,h4,h4,h6,pre,form,fieldset,
input,textarea,p,blockquote,th,td       { margin: 0; padding: 0; }
table                                   { border-collapse: collapse; border-spacing: 0; }
fieldset,img                            { border: 0; vertical-align: bottom; }
a,h1                                    { overflow: hidden; outline: none }
ol,ul                                   { list-style: none; }
caption,th                              { text-align: left; }
h1,h2,h3,h4,h4,h6                       { font-size: 100%; font-weight: normal; overflow: hidden; }
q:before,q:after                        { content: ''; }
abbr,acronym                            { border: 0;}
.clear:after                            { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clear                                  { display: inline-block; }
html[xmlns] .clear                      { display: block; }
* html .clear                           { height: 1%; }
html,body                               { width: 100% }


/* ---------- GENERAL */
body                                    { background: #000 url(../images/bg.jpg) no-repeat; font-family: Verdana, Tahoma, Arial, sans-serif; font-size: 11px; color: #fff; }
#container                              { width: 968px; margin: 0 auto; position: relative; padding: 20px 0 0 0 }


/* ---------- HEADER */
#header                                 { height: 180px; }
#header h1                              { float: left; text-indent: -9999px; background: transparent url(../images/logo.png) no-repeat; width: 383px; height: 146px; }
#header h1 a                            { display: block; width: 383px; height: 146px; }
#appointment                            { float: right; background: transparent url(../images/appointment_bg.png) no-repeat; width: 496px; height: 145px; }
#appointment a                          { display: block; text-indent: -9999px; background: transparent url(../images/appointment.png) no-repeat; width: 320px; height: 46px; margin: 100px 0 0 100px }


/* ---------- CONTENT */
#aside                                  { float: left; width: 245px; }
#aside ul li                            { margin: 0 0 10px 0 }
#aside ul li a                          { display: block; color: #fff; font-weight: bold; font-size: 13px; text-decoration: none; background: transparent url(../images/link_bg.png) no-repeat top left; width: 196px; height: 30px; padding: 14px 0 0 47px; }
#aside ul li a:hover, #aside .active    { background-position: bottom left !important; }
#main                                   { float: left; margin: 0 0 0 20px }

/* ----- home */
.home #aside ul                         { margin: 30px 0 0 0; }
#products-box                           { float: left; margin: 0 50px 0 0; background: transparent url(../images/our-products_bg.png) no-repeat; width: 320px; height: 178px; position: relative; }
#products-box ul                        { height: 120px; margin: 50px 0 0 15px }
#products-box ul li                     { float: left; width: 90px; margin: 0 10px 0 0 }
#products-box ul li img                 { display: block; width: 90px; height: 82px; margin: 0 0 5px 0 }
#products-box ul li a                   { color: #fff; font-weight: bold; text-align: center; display: block; margin: 2px 0 0 0 }
#news-box                               { float: left; background: transparent url(../images/news_bg.png) no-repeat; width: 320px; height: 128px; position: relative; padding: 50px 0 0 0; }
#news-scroll                            { width: 310px; height:120px; overflow: auto }
.jScrollArrowUp                         { background: url(../images/arrow_up.png) no-repeat top center; }
.jScrollArrowDown                       { background: url(../images/arrow_down.png) no-repeat bottom center; }
.jScrollPaneTrack                       { background: url(../images/scroller.png) no-repeat center center; }
.jScrollPaneDrag                        { background: #596e83; width: 6px !important; left: 2px }
.more                                   { display: block; text-indent: -9999px; width: 85px; height: 35px; position: absolute; top: 0; right: 85px; }
.news                                   { width: 200px; padding: 0 0 0 70px; position: relative; margin: 0 0 15px 15px }
.news .date                             { width: 60px; color: #8ea5c1; font-weight: bold; position: absolute; top: 0; left: 0; text-align: right; display: block }
.news h2                                { color: #fff; font-weight: bold }
.news p                                 { color: #8d939a }

/* ----- sub pages */
#breadcrumb                             { height: 15px; margin: 0 0 20px 0 }
#breadcrumb li                          { float: left; }
#breadcrumb li a                        { color: #7a8a95 }
#breadcrumb li span                     { padding: 0 5px; color: #de0006 }
#breadcrumb .active                     { color: #fff; font-weight: bold; text-decoration: none }
#top-box                                { background: transparent url(../images/top-box_bg.png) no-repeat; width: 693px; height: 23px; }
#box                                    { background: transparent url(../images/box_bg.png) repeat-y; width: 678px; padding: 0 0 0 15px; }

/* ----- text */
.block h2                               { background: transparent url(../images/title_bg.png) no-repeat; width: 648px; height: 42px; padding: 8px 0 0 15px; }
.block h2 .date                         { display: block; font-size: 10px; color: #7a8a95 }
.block h2 .title                        { display: block; font-size: 16px; background: transparent url(../images/red-arrow.png) no-repeat center left; padding: 0 0 0 20px; margin: 5px 0 0 0 }
.block p                                { padding: 10px 0 30px 5px; width: 620px; }
#bot-box                                { background: transparent url(../images/bot-box_bg.png) no-repeat; width: 693px; height: 23px; }

/* ----- gallery */
#gallery li                             { float: left; width: 75px; height: 75px; margin: 0 13px 15px 0; }
#gallery li img                         { display: block; width: 75px; height: 75px; margin: 0 0 5px 0; }
#gallery li a                           { display: block; font-weight: bold; color: #fff; text-decoration: none; }


/* ---------- FOOTER */
#footer                                 { color: #5b6872; font-size: 10px; margin: 20px 0 0 0; padding: 0 0 20px 0; }
#footer #copyright                      { float: left; }
#footer a                               { color: #8ea5c1; }
#footer #note                           { float: right; margin: 0 10px 0 0 }
#footer #note span                      { color: #8ea5c1; }