/**
 *
 * @author	Benoit Asselin <benoit(at)agenceici(dot)com>
 * @version	style.css, 2010/03/17
 * @link	http://www.agenceici.com/
 * @link	http://www.trydan.fr/
 *
 */


* { padding: 0; margin: 0; font-family: Arial, sans-serif; }
html, body { width: 100%; height: 100%; font-size: 12px; font-family: Arial, sans-serif; color: #fff; }
body { background: url(../images/interface/background.gif) center; }

ul, li { list-style: none; }
img { border: 0 none; }


.clear { clear: both; }
.no-spam { display: none; }


table.container { width: 100%; height: 100%; }
td.tleft { width: 50%; }
td.container { width: 1200px; height: 100%; }
td.tright { width: 50%; }
td.footer { padding: 5px; font-size: 11px; }


div.tleft { position: relative; height: 530px; overflow: hidden; background: url(../images/interface/index-circle-background.png) repeat-x; }
div.tleft img.wave-1 { position: absolute; right: -120px; top: 207px; width: 1352px; height: 323px; background: url(../images/interface/wave.png); }
div.tleft img.wave-2 { display: none; }
div.tleft img.wave-3,
div.tleft img.wave-4 { display: none; }
div.container { position: relative; width: 1200px; height: 530px; margin: 0 auto; background: url(../images/interface/index-circle-background.png) repeat-x; z-index: 1; }
div.tright { position: relative; height: 530px; overflow: hidden; background: url(../images/interface/index-circle-background.png) repeat-x; }
div.tright img.wave-1 { position: absolute; left: -1080px; top: 207px; width: 1352px; height: 323px; background: url(../images/interface/wave.png); }
div.tright img.wave-2 { position: absolute; left: 272px; top: 207px; width: 1352px; height: 323px; background: url(../images/interface/wave.png); }
div.tright img.wave-3,
div.tright img.wave-4 { display: none; }


.logo { position: absolute; right: 0; top: 30px; width: 226px; height: 53px; z-index: 32; background-image: url(../images/interface/logo.png); }
.logo img.png { display: none; }
.logo span { display: none; }


.menu { position: relative; padding-top: 30px; width: 945px; height: 24px; z-index: 32000; background: url(../images/interface/line-gradient.png) 100% 30px no-repeat; }
.menu img.contact { position: absolute; left: 70px; top: 8px; width: 169px; height: 62px; background: url(../images/interface/contact.png); }
.menu img.png { display: none; }
.menu ul { position: absolute; right: 0; top: 31px; width: 533px; height: 23px; }
.menu li { float: left; }
.menu li a { display: block; height: 23px; background-image: url(../images/interface/menu.gif); }
.menu li a span { display: none; cursor: pointer; }
.menu li.menu-1 a { width: 68px; background-position: 0px 0px; }
.menu li.menu-1 a.active,
.menu li.menu-1 a.active-2,
.menu li.menu-1 a:hover { width: 68px; background-position: 0px -23px; }
.menu li.menu-2 a { width: 190px; background-position: -68px 0px; }
.menu li.menu-2 a.active,
.menu li.menu-2 a.active-2,
.menu li.menu-2 a:hover { width: 190px; background-position: -68px -23px; }
.menu li.menu-3 a { width: 75px; background-position: -258px 0px; }
.menu li.menu-3 a.active,
.menu li.menu-3 a.active-2,
.menu li.menu-3 a:hover { width: 75px; background-position: -258px -23px; }
.menu li.menu-4 a { width: 70px; background-position: -333px 0px; }
.menu li.menu-4 a.active,
.menu li.menu-4 a.active-2,
.menu li.menu-4 a:hover { width: 70px; background-position: -333px -23px; }
.menu li.menu-5 a { width: 54px; background-position: -403px 0px; }
.menu li.menu-5 a.active,
.menu li.menu-5 a.active-2,
.menu li.menu-5 a:hover { width: 54px; background-position: -403px -23px; }
.menu li.menu-6 a { width: 76px; background-position: -457px 0px; }
.menu li.menu-6 a.active,
.menu li.menu-6 a.active-2,
.menu li.menu-6 a:hover { width: 76px; background-position: -457px -23px; }
.menu .menu-categories { display: none; position: absolute; left: 258px; top: 23px; width: 142px; height: inherit; border-top: 1px solid #6c0103; }
.menu .menu-categories li { position: relative; border: 1px solid #6c0103; border-top: 0 none; }
.menu .menu-categories li.first { border-top: 0 none; }
.menu .menu-categories li a { position: relative; display: block; color: #6c0103; text-decoration: none; width: 140px; background: url(../images/interface/menu-background-1.png); }
.menu .menu-categories li a:hover { width: 140px; background: #d9b6b7; }
.menu .menu-categories li a.active,
.menu .menu-categories li a.active-2 { width: 140px; background: #d9b6b7; }
.menu .menu-categories li a span { display: block; width: 135px; padding: 5px 0 5px 5px; }
.menu .menu-categories li a span.arrow { position: absolute; right: 5px; top: 7px; width: 4px; height: 7px; padding: 0; background: url(../images/interface/menu-arrow.gif) no-repeat; }
.menu .menu-sub-categories { display: none; position: absolute; left: 140px; top: -1px; width: 142px; height: inherit; border-top: 1px solid #6c0103; }
.menu .menu-sub-categories li a { background: #d9b6b7; }
.menu .menu-sub-categories li a.active,
.menu .menu-sub-categories li a.active-2,
.menu .menu-sub-categories li a:hover { color: #fff; background: #a93841; }


#form-search { position: absolute; left: 251px; top: 31px; width: 160px; height: 23px; z-index: 32000; border-right: 1px solid #b84952; }
#form-search-background { width: 150px; height: 24px; background: url(../images/interface/form-search.png); }
#form-search-q { position: absolute; left: 10px; top: 5px; width: 115px; font-size: 13px; color: #fff; border: 0 none; background: #c06a70; }
#form-search-ok { position: absolute; left: 125px; top: 0px; width: 25px; height: 25px; opacity: 0; -moz-opacity: 0; filter: alpha(opacity=0); border: 0 none; cursor: pointer; }
#form-search .suggest { display: none; position: absolute; left: 5px; top: 25px; border: 1px solid #6c0103; border-top: 0 none; }
#form-search .suggest p { margin: 0; padding: 5px 10px 5px 5px; color: #6c0103; cursor: pointer; border-top: 1px solid #6c0103; background: url(../images/interface/menu-background-1.png); }
#form-search .suggest p.active { background: #d9b6b7; }
#form-search .suggest p.hover { background: #d9b6b7; }


.wave-background { position: absolute; left: 0; top: 207px; width: 1200px; height: 323px; overflow: hidden; z-index: 16; }
.wave-background img.png-1 { position: absolute; left: -1232px; top: 0; width: 1352px; height: 323px; background: url(../images/interface/wave.png); }
.wave-background img.png-2 { position: absolute; left: 120px; top: 0; width: 1352px; height: 323px; background: url(../images/interface/wave.png); }


.baseline { position: absolute; color: #616161; left: 10px; top: 400px; letter-spacing: 1px; line-height: 16px; text-align: justify; width: 1180px; z-index: 32; }
.baseline address { color: #000; font-style: normal; font-weight: bold; border-top: 1px solid #000; margin-top: 7px; padding-top: 7px; }
.baseline address a { color: #000; }


.mageflo { position: absolute; left: 510px; top: 478px; width: 515px; height: 44px; background: url(../images/interface/logo-mageflo.gif); z-index: 32; }
.mageflo span { display: none; }



#page-index { }
#page-index .menu img.contact { display: none; }
#page-index #form-search { left: 1050px; top: 100px; border-right: 0 none; }

#page-index .circles { position: absolute; left: 0; top: 0; }
#page-index .circles #circle-1 { position: absolute; left: 350px; top: 0; width: 150px; height: 270px; overflow: hidden; }
#page-index .circles #circle-1 img.image { position: absolute; left: 15px; top: 89px; }
#page-index .circles #circle-1-fff { position: absolute; left: 350px; top: 0; width: 150px; height: 270px; background: #fff; z-index: 10; }
#page-index .circles #circle-1-background { position: absolute; left: 350px; top: 0; width: 150px; height: 270px; background: url(../images/interface/index-circle-1.png); z-index: 11; }
#page-index .circles #circle-2 { position: absolute; left: 500px; top: 0; width: 320px; height: 270px; overflow: hidden; }
#page-index .circles #circle-2 img.image { position: absolute; left: 18px; top: 75px; }
#page-index .circles #circle-2-fff { position: absolute; left: 500px; top: 0; width: 320px; height: 270px; background: #fff; z-index: 10; }
#page-index .circles #circle-2-background { position: absolute; left: 500px; top: 0; width: 320px; height: 270px; background: url(../images/interface/index-circle-2.png); z-index: 11; }
#page-index .circles #circle-3 { position: absolute; left: 820px; top: 0; width: 159px; height: 270px; overflow: hidden; }
#page-index .circles #circle-3 img.image { position: absolute; left: 8px; top: 70px; }
#page-index .circles #circle-3-fff { position: absolute; left: 820px; top: 0; width: 159px; height: 270px; background: #fff; z-index: 10; }
#page-index .circles #circle-3-background { position: absolute; left: 820px; top: 0; width: 159px; height: 270px; background: url(../images/interface/index-circle-3.png); z-index: 11; }
#page-index .circles #circle-4 { position: absolute; left: 979px; top: 0; width: 126px; height: 270px; overflow: hidden; }
#page-index .circles #circle-4 img.image { position: absolute; left: 0px; top: 160px; }
#page-index .circles #circle-4-fff { position: absolute; left: 979px; top: 0; width: 126px; height: 270px; background: #fff; z-index: 10; }
#page-index .circles #circle-4-background { position: absolute; left: 979px; top: 0; width: 126px; height: 270px; background: url(../images/interface/index-circle-4.png); z-index: 11; }

#page-index .big-product { position: absolute; left: 0; top: -15px; z-index: 32; }
#page-index .big-product img.img-1 { position: absolute; width: 360px; height: 410px; background: url(../images/index/chair-1.png); }
#page-index .big-product img.img-2 { position: absolute; width: 360px; height: 410px; background: url(../images/index/chair-2.png); }

#page-index #circle-products { position: absolute; left: 350px; top: 270px; width: 850px; height: 138px; overflow: hidden; z-index: 32; }
#page-index #circle-products ul { position: absolute; height: 138px; }
#page-index #circle-products ul li { position: relative; float: left; width: 113px; height: 138px; }
#page-index #circle-products ul li img.image { position: absolute; left: 0; top: 12px; width: 113px; height: 113px; }
#page-index #circle-products ul li img.background { position: absolute; left: 0; top: 0; width: 113px; height: 138px; background: url(../images/interface/circle-product.png); }
#page-index #circle-products .gradient { position: absolute; left: 0; top: 0; width: 113px; height: 138px; background: url(../images/interface/circle-gradient.png); }



#page-references { }
#page-references #references { display: block; position: absolute; top: 90px; width: 1200px; height: 286px; overflow: hidden; z-index: 32; }
#page-references #references img.shadow { display: block; width: 100%; height: 7px; background: url(../images/interface/products-shadow.png); }
#page-references #references ul { position: absolute; top: 7px; height: 279px; }
#page-references #references li { position: relative; float: left; height: 279px; background: url(../images/interface/products-name-background.gif) bottom repeat-x; cursor: pointer; }
#page-references #references img.catalog { display: block; border-right: 1px solid #950611; }
#page-references #references img.maximum { display: none; position: absolute; visibility: hidden; }
#page-references #references del { display: none; }
#page-references #references span { position: absolute; right: 0; top: 250px; display: block; text-align: right; color: #747474; padding: 7px 14px 0 0; height: 22px; font-size: 13px; background: url(../images/interface/products-name-separator.gif) right no-repeat; }



#page-products { }
#page-products #products { display: block; position: absolute; top: 90px; width: 1200px; height: 286px; overflow: hidden; z-index: 32; }
#page-products #products img.shadow { display: block; width: 100%; height: 7px; background: url(../images/interface/products-shadow.png); }
#page-products #products ul { position: absolute; top: 7px; height: 279px; }
#page-products #products li { position: relative; float: left; height: 279px; background: url(../images/interface/products-name-background.gif) bottom repeat-x; cursor: pointer; }
#page-products #products img.catalog { display: block; border-right: 1px solid #950611; }
#page-products #products img.maximum { display: none; position: absolute; visibility: hidden; }
#page-products #products del { display: none; }
#page-products #products span { position: absolute; right: 0; top: 250px; display: block; text-align: right; color: #747474; padding: 7px 14px 6px 0; font-size: 13px; background: url(../images/interface/products-name-separator.gif) right top no-repeat; }
#page-products #products strong { font-weight: normal; }
#page-products #products span.over { padding-bottom: 7px; top: auto; bottom: 0; background: #e7e7e7 url(../images/interface/products-name-background.gif) top repeat-x; border-right: 1px solid #747474; }

.display-image { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url(../images/none.gif); z-index: 32000; }
.display-image div { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000 url(../images/interface/spinner.gif) 50% 50% no-repeat; }
.display-image img { position: absolute; display: block; left: 50%; top: 50%; background: #fff; }



#page-search { }
#page-search div.tleft,
#page-search div.tright { background: url(../images/interface/page-background.png) repeat-x; }
#page-search div.tleft img.wave-1,
#page-search div.tright img.wave-1,
#page-search div.tright img.wave-2 { top: 399px; height: 131px; background: url(../images/interface/wave-lite.png); }
#page-search #pages { position: absolute; left: 250px; top: 10px; color: #a11a0e; z-index: 320; }
#page-search #pages big { float: left; padding-right: 10px; font-size: 14px; }
#page-search #pages a { display: block; float: left; margin-left: 5px; width: 13px; height: 14px; color: #a11a0e; border: 1px solid #a11a0e; text-decoration: none; background: #fff; text-align: center; }
#page-search #pages a:hover,
#page-search #pages a.active { color: #fff; background: #a11a0e; }
#page-search #pages a.previous { background: #fff url(../images/interface/search-page-previous.gif) center no-repeat; }
#page-search #pages a.next { background: #fff url(../images/interface/search-page-next.gif) center no-repeat; }
#page-search #products { display: block; position: absolute; left: 0; top: 97px; width: 1200px; height: 295px; z-index: 32; background: url(../images/interface/page-background.png) 0 -97px repeat-x; }
#page-search #products img.shadow { display: block; position: absolute; left: 0; top: -7px; width: 100%; height: 7px; background: url(../images/interface/products-shadow.png); }
#page-search #products ul { position: absolute; left: 250px; top: 35px; width: 913px; height: 229px; background: url(../images/interface/search-background.gif); }
#page-search #products li { position: relative; float: left; margin: 1px 0 0 1px; width: 113px; height: 113px; cursor: pointer; }
#page-search #products li.empty { cursor: default; }
#page-search #products img.index { display: block; border-right: 1px solid #950611; }
#page-search #products img.maximum { display: none; position: absolute; visibility: hidden; }
#page-search #products span { display: none; position: absolute; right: 0; bottom: 0; text-align: right; color: #a11a0e; padding: 2px 5px 2px 2px; width: 106px; background: #fff; }
#page-search #products span.active { display: block; }



#page-society { }
#page-society div.tleft img.wave-1,
#page-society div.tright img.wave-1,
#page-society div.tright img.wave-2 { top: 70px; height: 460px; background: url(../images/interface/links-wave.png); }
#page-society .wave-background { top: 70px; height: 460px; }
#page-society .wave-background img.png-1,
#page-society .wave-background img.png-2 { height: 460px; background: url(../images/interface/links-wave.png); }
#page-society .society { position: absolute; left: 0; top: 160px; width: 1200px; height: 310px; z-index: 32; color: #000; text-align: justify; }
#page-society .society h1 { color: #7b060e; font-size: 14px; height: 12px; font-weight: normal; margin-bottom: 4px; border-bottom: 1px solid #bd8286; }
#page-society .society h1 span { padding-right: 5px; background: #fff; }
#page-society .society .left { position: absolute; left: 200px; top: 0; width: 500px; }
#page-society .society .right { position: absolute; left: 740px; top: 0; width: 375px; }



#page-links { }
#page-links div.tleft img.wave-1,
#page-links div.tright img.wave-1,
#page-links div.tright img.wave-2 { top: 70px; height: 460px; background: url(../images/interface/links-wave.png); }
#page-links .wave-background { top: 70px; height: 460px; }
#page-links .wave-background img.png-1,
#page-links .wave-background img.png-2 { height: 460px; background: url(../images/interface/links-wave.png); }
#page-links .links { display: block; position: absolute; left: 270px; top: 160px; width: 840px; z-index: 32; }
#page-links .links li { float: left; margin-right: 40px; margin-bottom: 10px; }
#page-links .links li a { display: block; width: 167px; height: 150px; text-decoration: none; color: #000; text-align: center;}
#page-links .links li a:hover span { text-decoration: underline; }
#page-links .links li img { display: block; border: 1px solid #5c5c5c; }



#page-contact { }
#page-contact .menu img.contact { display: none; }
#page-contact div.tleft { background: url(../images/interface/page-background-2-1.png) repeat-x; z-index: 32; }
#page-contact div.tright { background: url(../images/interface/page-background-2-2.png) repeat-x; }
#page-contact div.tleft img.wave-1,
#page-contact div.tright img.wave-1,
#page-contact div.tright img.wave-2 { top: 380px; height: 146px; background: url(../images/interface/contact-wave.png); }
#page-contact .wave-background { top: 380px; height: 146px; z-index: 320; }
#page-contact .wave-background img.png-1,
#page-contact .wave-background img.png-2 { height: 146px; background: url(../images/interface/contact-wave.png); }
#page-contact #gmaps { position: absolute; left: 0; top: 0; width: 650px; height: 360px; background: #fff; }
#page-contact #form { display: block; position: absolute; left: 0; top: 97px; width: 1200px; height: 360px; background: url(../images/interface/page-background-2-2.png) 0 -97px repeat-x; }
#page-contact #form img.shadow { display: block; position: absolute; left: 0; top: -7px; width: 100%; height: 7px; background: url(../images/interface/products-shadow.png); }
#page-contact #form img.shadow-circle { display: block; position: absolute; right: 550px; top: 0; width: 80px; height: 371px; background: url(../images/interface/contact-circle.png); }
#page-contact #form .circle-red { position: absolute; right: 0px; top: 40px; width: 217px; height: 272px; background: url(../images/interface/contact-circle-red.gif); }
#page-contact div.tright img.wave-4 { display: block; position: absolute; left: 0; top: 137px; width: 55px; height: 272px; background: url(../images/interface/contact-circle-red.gif) right; } /* .circle-red { ... } */
#page-contact #frm-contact { position: relative; z-index: 320; }
#page-contact #frm-contact table { position: absolute; right: 0; top: 50px; color: #000; width: 550px; }
#page-contact #frm-contact .caption { text-align: justify; font-weight: normal; padding: 15px 0; color: #747474; font-size: 13px; }
#page-contact #frm-contact label { color: #8e0610; }
#page-contact #frm-contact input { height: 15px; border-width: 1px; padding: 1px; font-size: 12px; }
#page-contact #frm-contact .text-l05 { width: 70px; }
#page-contact #frm-contact .text-l1 { width: 120px; }
#page-contact #frm-contact .text-l2 { width: 308px; }
#page-contact #frm-contact input.submit { width: 150px; height: 22px; border-width: 2px; background-color: #ccc; margin-top: 5px; }
#page-contact #frm-contact textarea { border-width: 1px; padding: 1px; font-size: 12px; }
#page-contact #frm-contact select { border-width: 1px; font-size: 12px; }
#page-contact #frm-contact .warning { background-color: #c06a70; color: #fff; }
#page-contact #frm-contact td { vertical-align: top; white-space: nowrap; }
#page-contact #frm-contact td.label-1 { padding: 2px 5px 0 0; text-align: right; }
#page-contact #frm-contact td.label-2 { padding: 2px 0 0 5px; text-align: left; }
#page-contact #frm-contact td.input-1 { width: 0px; }
#page-contact #frm-contact td.input-1 textarea { height: 70px; }
#page-contact #frm-contact td.input-2 { text-align: right; }
#page-contact #frm-contact td.input-3 { margin: 0; }
#page-contact #frm-contact td.input-4 { text-align: center; }
#page-contact #frm-contact td.input-4 textarea { width: 150px; height: 130px; }
#page-contact #frm-contact td.sep-1 { font-size: 9px; }
#page-contact #frm-contact td.sep-4 { font-size: 9px; width: 30px; }
#page-contact .thanks { position: absolute; right: 0; top: 100px; width: 550px; }
#page-contact .thanks p { padding: 10px; color: #000; }
#page-contact .baseline { position: absolute; top: 70px; left: 0px; width: 945px; }
#page-contact .baseline address { color: #fff; border: 0 none; margin: 0; padding: 0; text-align: right; letter-spacing: 0; }
#page-contact .baseline a { color: #fff; }



#page-admin { background: #fff; }
#page-admin #form-search { display: none; }
#page-admin div.tleft img.wave-1,
#page-admin div.tright img.wave-1,
#page-admin .wave-background,
#page-admin .text,
#page-admin .mageflo,
#page-admin .footer { display: none; }
#page-admin div.tleft { }
#page-admin div.tleft div.background,
#page-admin div.tright div.background { background: #fff; margin-top: 75px; height: 100%; }
#page-admin div.admin { position: relative; margin-top: 21px; padding: 10px 0; width: 1200px; height: 380px; color: #000; background: #fff; z-index: 32; }
#page-admin fieldset { border: 1px solid #a93841; width: 600px; margin: 10px auto; padding: 10px; }
#page-admin fieldset legend { padding: 0 5px; color: #a93841; }
#page-admin .menu-admin { position: relative; padding-top: 30px; width: 945px; height: 24px; z-index: 32000; background: url(../images/interface/line-gradient.png) right 30px no-repeat; }
#page-admin .menu-admin ul { margin-top: -13px; }
#page-admin .menu-admin li { float: right; }
#page-admin .menu-admin li a { display: block; padding: 5px 10px; color: #fff; border-right: 1px solid #b84853; text-decoration: none; letter-spacing: 1px; cursor: pointer; }
#page-admin .menu-admin li a span { font-family: Helvetica, Arial, serif; cursor: pointer; }
#page-admin .menu-admin li a:hover { color: #fff; background: #a93841; }
#page-admin .menu-admin li.first a { border-right: 0 none; }
#page-admin input.text-1 { width: 200px; }
#page-admin table.products,
#page-admin table.references { margin: 0 auto; padding: 5px; border: 1px solid #a93841; }
#page-admin table.products th,
#page-admin table.references th { color: #a93841; padding: 2px 5px; }
#page-admin table.form { margin: 10px auto; }
#page-admin table.form th { color: #a93841; padding: 2px 5px; }
#page-admin table.form td.label { text-align: right; padding-right: 5px; white-space: nowrap; }
#page-admin table.form td.input { padding: 2px 5px; }
#page-admin table.form hr { border: 0 none; border-top: 1px solid #ebdfe1; }
#page-admin tr.hover td { background-color: #ebdfe1; cursor: pointer; }
#page-admin p.pages { text-align: center; padding: 5px; }
#page-admin p.pages a { color: #000; border: 1px solid #a93841; text-decoration: none; margin: 0 1px; }
#page-admin p.pages a.active { color: #fff; background: #a93841; text-decoration: none; }


