/* 
File: Main Style CSS for Zoomba Media
Author: Darren Marshall - darren.marshall@gmail.com 
Date: 10 April 2010
*/
html{ background-color: #f1f0f1; /* fix for chrome */ overflow-y:scroll; /* force all browsers to always show the scrollbar */ }
body, p, img, form{ margin:	0; padding:0; border: 0; }
body{ background-color: #f1f0f1; background: url('../img/layout/page-background.png') repeat-x top left; }
body, p, h1, h2, h3, h4, dl, dt, a, div, span, textarea { font-family: Arial, Verdana, sans-serif; color: #747272; }
img{ border: 0; }

div#container{ margin: 0 auto; width: 959px; border: 1px solid #9a9a9a; border-top: 0; border-bottom: 0; background-color: #FFFFFF; }
div#head{ width: 959px; height: 93px; background: url('../img/layout/head-background.png') no-repeat top left; }
div#head .left{ margin: 42px 0px 0px 20px; }
div#head .right{ margin: 20px 20px 0px 0px; }
div#navigation{ margin-top: 33px; width: 448px; height: 40px; }
div#navigation ul { margin: 0; padding: 0; list-style: none; }
div#navigation ul li{ float: left; }
div#navigation ul li a{ display: block; height: 40px; background:transparent url('../img/layout/zoomba-navigation.png') no-repeat 0 0; text-indent:-9009px; }

/* 72, 138, 87, 68, 83 */
div#navigation ul li#nhome a{ width: 72px; background-position:  0px 0px; }
div#navigation ul li#nphilosophy a{ width: 138px; background-position:  -72px 0px; }
div#navigation ul li#nportfolio a{ width: 87px; background-position:  -210px 0px; }
div#navigation ul li#nnews a{ width: 68px; background-position:  -297px 0px; }
div#navigation ul li#ncontact a{ width: 83px; background-position:  -365px 0px; }

div#navigation ul li#nhome a:hover{ width: 72px; background-position:  0px -41px; }
div#navigation ul li#nphilosophy a:hover{ width: 138px; background-position:  -72px -41px; }
div#navigation ul li#nportfolio a:hover{ width: 87px; background-position:  -210px -41px; }
div#navigation ul li#nnews a:hover{ width: 68px; background-position:  -297px -41px; }
div#navigation ul li#ncontact a:hover{ width: 83px; background-position:  -365px -41px; }

div#navigation ul li#nhome_selected a{ width: 72px; background-position:  0px -80px; }
div#navigation ul li#nphilosophy_selected a{ width: 138px; background-position:  -72px -80px; }
div#navigation ul li#nportfolio_selected a{ width: 87px; background-position:  -210px -80px; }
div#navigation ul li#nnews_selected a{ width: 68px; background-position:  -297px -80px; }
div#navigation ul li#ncontact_selected a{ width: 83px; background-position:  -365px -80px; }

div#foot{ width:  959px; height: 69px; background: url('../img/layout/foot-background.png') no-repeat top left; }
div#foot .left{ margin: 16px 0px 0px 20px; }
div#foot .right{ font-size: 14px; margin: 28px 20px 0px 0px; }
div#foot .right a, div#foot .right a:visited{ text-decoration: underline; font-size: 12px; }
div#foot .right a:hover{ text-decoration:none; }
/* content containers */
div#content{ padding: 30px 20px 20px 20px; }
div#content .left{ width: 448px; }
div#content .right{ width: 448px; }
/* specific containers - home news */
div#hnews{ width: 879px; height: 136px; margin-left: 5px; padding: 39px 20px 20px 14px; background: url('../img/layout/latest-news-box.png') no-repeat top left; }
div#hnews .hitem{ width: 432px; }
div#hnews .hitem .himage{ width:  86px; height: 136px; background: url('../img/layout/latest-news-image-border.png') no-repeat top left; }
div#hnews .hitem .himage img{ margin: 3px 0px 0px 3px; }
div#hnews .right .himage{ margin-left: 2px; }
div#hnews .hitem .htext{ width:  326px; font-size: 14px; padding-left: 16px; }
/* specific containers - home feedback */
div#feedback{ width: 420px; height: 188px; padding: 39px 14px 0px 14px; margin-left: 5px; background: url('../img/layout/feedback-box.png') no-repeat top left; }
div#feedback .left{ width: 159px; padding: 2px; }
div#feedback .right{ width: 240px; height: 110px; }
div#feedback .right p{ color: #FFFFFF; }
div#feedback .right .sig{ color: #FFFFFF; font-size: 13px; font-weight: bold; width: 240px; padding-top: 10px; text-align: right; }
div#feedback #viewbutton{ float: right; width: 240px; height: 35px; margin-top: 17px; }
/* specific containers - home quick-contact */
div#quick-contact{ width: 434px; height: 188px; padding: 39px 0px 0px 14px; background: url('../img/layout/quick-contact-box.png') no-repeat top left; }
div#main-contact{ margin: 20px 0px 0px 10px; }
div#quick-contact #contact .left, 
div#main-contact #contact .left{ width: 319px; }
div#quick-contact #contact .right, 
div#main-contact #contact .right{ width: 93px; margin: 126px 14px 0px 0px; }
#contact .left .qctext{ border: 1px solid #000000; width: 199px; padding: 7px; height: 18px; font-size: 14px; color: #747272; }
#contact .left .qctextarea{ border: 1px solid #000000; padding: 7px; width: 299px; height: 68px; font-size: 14px; color: #747272; }
/* login */
div#clients{ font-weight: bold; font-size: 11px; color: #632877; text-align: right; clear: none; float: right; width: 448px; }
div#clients form input.logintext{ width: 100px; }
div#clients form input.loginbut{ vertical-align: bottom; }
/* common */
.left{ float: left; }
.right{ float: right; }
/* spacers */
.clear{ clear: both; width: 100%; }
.cxs{ height: 5px; }
.cs{ height: 10px; }
.cm{ height: 20px; }
/* text formatting */
p{ font-size: 13px; line-height: 140%; }
p.hpad{ padding: 20px 10px 0px 10px; }
p.npad{ padding-top: 10px; }
/* links */
a.main, a.main:visited{ color: #5d2568; font-weight: bold; text-decoration:underline; }
a.main:hover{ text-decoration: none; }
/* home slider */
#slider{ margin-top: -8px; }
#slider ul, #slider li{ margin:0; padding:0; list-style:none; }
#slider li{ width:448px; height:291px; overflow:hidden; }		
ol#controls{ margin: -28px 0px 0px 14px; padding:0; height:28px; }
ol#controls li{ margin:0 1px 0 0; padding:0; float:left; list-style:none; height:28px; line-height:28px; }
ol#controls li a{ float:left; height:28px; line-height:28px; text-decoration:none; }
/* image formatting */
img#latest-work{ margin-left: 14px; }
/* portfolio items */
div#portfolio{ margin-top: 15px; }
div#portfolio .portfolio_item{ margin: 5px 0px 5px 0px; width: 448px; }
div#portfolio .portfolio_item .left{ width: 178px; }
div#portfolio .portfolio_item .left img{ border: 1px solid #5d2568; }
div#portfolio .portfolio_item .right{ width: 270px; height: 126px; font-size: 14px; }
div#portfolio .portfolio_item .right p{ padding: 6px 0px 0px 0px; }
/* news page */
div#news{ margin-top: 5px; }
div#news .left{ width: 646px; }
div#news .right{ width: 254px; }
div#news .news_item{ margin: 5px 0px 5px 0px; width: 646px; }
div#news .news_item .left{ width: 100px; }
div#news .news_item .left img{ border: 1px solid #5d2568; }
div#news .news_item .right{ width: 546px; font-size: 14px; }
div#news .right #categories_head{ background: url('../img/layout/sub-news-categories-head.png') no-repeat top left; width: 254px; height: 31px; }
div#news .right #categories{ background: url('../img/layout/sub-news-categories-slice.png') repeat-y top left; }
div#news .right #categories_foot{ background: url('../img/layout/sub-news-categories-foot.png') no-repeat top left; width: 254px; height: 8px; }
div#news .right #subscribe{ width: 234px; height: 65px; padding: 39px 10px 10px 10px; background: url('../img/layout/sub-box-background-subscribe.png') no-repeat top left; }
div#news .right #subscribe .left{ width:  70px; }
div#news .right #subscribe .right{ width:  164px; padding-top: 9px; font-size: 13px; }
h1{ margin:  0; padding: 0px 0px 10px 0px; font-size: 24px; letter-spacing:-1px; }
.cerror{ margin: 10px 0px 0px 10px; width:  380px; padding: 16px; color: #000000; font-size: 13px; background-color: #f3f2f3; border: 1px solid #000000; }
.cerror img{ margin-bottom:  -3px; }
