/* 
Habitarum Kahakbal CSS
by momentum media design s.a. de c.v.
http://www.momentum.com.mx/
*/


/* ***** general ***** */
body { background: url(common/fnd.gif) top repeat-x #fff; color: #87756B; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 62.5% }




/* ***** layout ***** */
#container { margin: 20px auto; width: 960px }

#header { position: relative }
#content { padding: 40px 0 45px 0; overflow: hidden; position: relative }
#footer { margin: 0 10px }

#subIndex { border-right: solid 1px #E4E0DB; float: left; height: 100%; padding: 70px 4px 10px 10px; width: 200px }
#main { border-left: solid 1px #E4E0DB; font-size: 1.2em; padding: 5px 170px 10px 165px; margin: 0 0 0 214px }
#pagClientes #main { padding: 5px 50px 10px 50px }
#pagPortafolio #main { padding: 5px 0 10px 25px; width: 700px }
.innerSec { padding-bottom: 2em }

#thumbsBox { float: left; width: 185px }
#pictBox { margin-left: 200px; height: 460px; width: 460px }

#thumbs { margin-right: -2px; padding-bottom: 20px }
#main #thumbs li { float: left; display: block; padding: 0 8px 8px 0 }

#footBox { float: left; width: 600px }



/* menu */
#menu { display: block; height: 30px; padding: 30px 20px 50px 330px }
.menuBtn { float: left }
.menuBtn a { background: no-repeat; display: block; height: 16px; margin-right: 80px }

#mnuFirm a { background-image: url(common/mnu_firma.gif); width: 59px }
#mnuClie a { background-image: url(common/mnu_clientes.gif); width: 58px }
#mnuPort a { background-image: url(common/mnu_portafolio.gif); width: 83px }
#mnuCont a { background-image: url(common/mnu_contacto.gif); padding-right: 0; width: 76px }

#mnuFirm a:hover, #mnuFirm a:active, body#pagFirma #mnuFirm a { background-image: url(common/mnu_firma_on.gif) }
#mnuClie a:hover, #mnuClie a:active, body#pagClientes #mnuClie a { background-image: url(common/mnu_clientes_on.gif) }
#mnuPort a:hover, #mnuPort a:active, body#pagPortafolio #mnuPort a { background-image: url(common/mnu_portafolio_on.gif) }
#mnuCont a:hover, #mnuCont a:active, body#pagContact #mnuCont a { background-image: url(common/mnu_contacto_on.gif) }

.innerMenu { padding: 0 0 0 7px }
.innerMenuContainer { margin-bottom: 20px }

#project { font-size: 0.9em }
#project dt { display: block; color: #AB540F }
#project dd { padding-bottom: 1em }


/* images */
#pagHome img { display: block; margin: 55px auto 65px auto }
.pIco { display: block; float: left; height: 30px; margin-left: -35px; margin-top: -1px; width: 30px; }
.left { float: left }
.right { float: right; margin: -3px -140px 10px 10px }


/* heading */
h1#pageTitle { display: block; padding: 20px 0 0 10px; position: absolute }
h1#pageTitle a { background: url(common/logo.gif) no-repeat; display: block; height: 84px; width: 200px }

h2#secTitle { background: no-repeat; display: block; margin: 10px 0 0 10px; height: 30px; left: 0; position: absolute; width: 200px }

#pagFirma h2#secTitle { background-image: url(common/title_firma.gif) }
#pagClientes h2#secTitle { background-image: url(common/title_clientes.gif) }
#pagPortafolio h2#secTitle { background-image: url(common/title_portafolio.gif) }
#pagContact h2#secTitle { background-image: url(common/title_contacto.gif) }

h3, h4, h5, h6 { color: #AB540F }
h3 { font-size: 1.8em; padding-bottom: 1.5em }
h4 { font-size: 1.4em; padding-top: 1.5em }

h4#slogan { background: url(common/slogan_1.gif) no-repeat; display: block; height: 8px; padding-bottom: 8px; width: 221px }


/* links */
a { color: #D96D00 }
a#mmdLink { background: url(common/mmd.gif) no-repeat; display: block; height: 45px; margin: 0 20px 0 auto; width: 50px }
a.subMenuLink, strong.subMenuLink { color: #87756B; display: block; font-family: Arial, Helvetica, sans-serif; font-size: 1.4em; font-weight: bold; padding-bottom: 12px; text-decoration: none; text-transform: uppercase }
a.subMenuLink:hover, a.subMenuLink:active, a.selected, strong.subMenuLink:hover { color: #AB540F }

a.inMnuLink { display: block; margin-left: 24px; padding: 3px; text-decoration: none }
a.inMnuLink:hover { background: #F7E2CC }
a.inMnuLink:active, a.active, a.active:hover { background: #AB540F; color: #fff }

a.picLink { border: 2px solid #fff; display: block; height: 50px; width: 50px }
a.picActive { border-color: #ACA095 }


/* inline */
p, #main ul, #main ol { line-height: 200%; padding-bottom: 1em }
p.imgAlt { font-style: italic }
strong { color: #544943; font-style: inherit }
em { font-style: oblique }

#main li { padding-left: 30px }
#main ul li, #main ol ul li { list-style: inside disc }

#main ul.logos li { display: block; float: left; height: 100px; list-style: none; padding: 0 10px 10px 0; width: 100px }

strong.subMenuLink { cursor: default }


/* forms */
form { margin: 40px auto }
form ul { padding-bottom: 20px }
#main form li { border-bottom: 1px dotted #E4E0DB; list-style: none; padding: 5px }
label { display: block; float: left; width: 90px }

input[type=text], textarea { background: #F7F6F4; border: 1px solid #C9C1B8; color: #87756B; display: block; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: inherit; margin-left: 110px; padding: 2px; width: 200px }
textarea { height: 75px }
button { background: url(common/fnd.gif) top repeat-x #fff; border: 1px solid #E4E0DB; border-bottom-color: #C9C1B8; border-top: none; color: #D96D00; font-size: inherit; margin: 5px; padding: 3px }

.buttons { text-align: center }
.invalid { background: #D96D00 !important; color: #fff !important }

/* **** Home con movimiento **** */
#homePics { margin: 0 auto; position: relative; padding: 0; width: 912px }
.hpic { display: block; float: left; height: 350px; margin-right: 5px; overflow: hidden; padding: 0; width: 225px }
.hpic a { display: block; color: inherit; font-size: 1.2em; font-weight: bold; padding: 320px 0 0 457px; text-align: right; text-decoration: none; text-transform: uppercase; width: 200px }
#picOff { background: url(common/home_1.jpg) left no-repeat; color: #000 }
#picTur { background: url(common/home_2.jpg) left no-repeat; color: #000 }
#picRes { background: url(common/home_3.jpg) left no-repeat; color: #000 }
#picInd { background: url(common/home_4.jpg) left no-repeat; color: #fff; margin-right: 0 }

/* **** Scroll para Portafolio **** */
#catCorp { height: 270px; overflow: auto }
.jScrollPaneContainer { overflow: hidden; position: relative; z-index: 1 }
.jScrollPaneTrack { background: #efefef; cursor: pointer; height: 100%; left: 0; position: absolute; right: auto; top: 0 }
.jScrollPaneDrag { background: #ACA095; cursor: pointer; overflow: hidden; position: absolute }
.jScrollPaneDragTop { position: absolute; left: 0; overflow: hidden; top: 0 }
.jScrollPaneDragBottom { bottom: 0; left: 0; overflow: hidden; position: absolute }




/* ***** fixes ***** */
a#mmdLink span, h1#pageTitle span, h2#secTitle span, h4#slogan, .menuBtn span, hr, .hpic img { display: none }
#content:after, #thumbs:after, #main ul.logos:after { clear: both; content: "."; display: block; height: 0; visibility: hidden }



/* ie */:
.ie #project { clear: both }
.ie #subIndex { border: none }

/* ie6 */
.ie6 h2#secTitle { margin-left: -205px }