/* CIULLA-ASSOC.COM */
/*------------------------------------------------------
RESET
------------------------------------------------------*/
html,body,img,h1,h2,h3,h4,h5,h6, form,object { margin: 0; padding: 0; border: none; }
ul,ul li,dt,dd {margin: 0; padding: 0; list-style: none;}

/*------------------------------------------------------
BASIC ELEMENTS
------------------------------------------------------*/
html{overflow-y:scroll; height: 100%; }/*<--FORCE SCROLL BAR IN FIREFOX*/
body{font-family:Helvetica, Arial, sans-serif; font-size:11px; color: #333; background: #000 url(/_img/body_bg.png); height: 100%; }
body.gallery { background:none; background-color: #fff; }
img{vertical-align:middle}
a{color:#808080;}
a:hover{color:#333;}
strong{font-weight:bold;}
p { margin:0 0 1em 0; }
sup { vertical-align: text-top; padding-left: 1px; position: relative; top: -2px; }
object { display: block; outline:none; }

/*------------------------------------------------------
FUNDAMENTAL CONTAINERS
------------------------------------------------------*/
.wrap { width: 832px; margin: 0 -416px; position: absolute; top: 40%; left:50%}
.main { background-color: #fff; height: 416px; position:relative; }
.titlebar { height: 37px; margin:-181px 0 -1px 0; position:relative; z-index: 300; }
.content { position: relative; height:416px; color: #808080; }
.x_chk{width:1px;height:1px;display:none;}
.f_links { position: absolute; bottom: -20px; right: 40px; }
.f_links a { float:  left; }
.f_links a:hover { background-position: 0 -12px; }
.f_home { display: block; text-indent: -999em; overflow: hidden; background: url(/_img/foot_cialla.png) no-repeat; width: 111px; height: 12px; }
.f_contact { display: block; text-indent: -999em; overflow: hidden; background: url(/_img/foot_contact.png) no-repeat; width: 75px; height: 12px; }

.gallery .f_links { bottom:-45px; }
.gallery .f_home { background-image: url(/_img/foot_cialla_w.png); }
.gallery .f_contact { background-image: url(/_img/foot_contact_w.png); }

/*------------------------------------------------------
GLOBAL STYLES
------------------------------------------------------*/
.int_logo { position: absolute; top: 42px; left: 50px; }
.int_logo_txt { position: absolute; top: 42px; left: 105px; }
.paging a { padding: 3px 5px; text-decoration: none; z-index:2000; }
.paging strong { color: #00aeef; }
li#paging{margin:0;}
.pagenotfound { position: absolute; top: 140px; left: 116px; }
.pagenotfound_copy { position: absolute; top: 200px; left: 116px; width: 400px; }

/*------------------------------------------------------
MAINNAV
------------------------------------------------------*/
.mainnav { width: 20px; position: absolute; left:832px; top:-4px;}
.mainnav a { display: block; width: 25px; height: 70px; position: absolute; background-image: url(/_img/mainnav.png); background-repeat: no-repeat; text-indent: -999em; overflow: hidden; }

.mainnav ul{position:relative;top:-2px;}
.mainnav object{outline:none;}

.mainnav .philosophy { top: 0; background-position: -50px 0;}
.mainnav .philosophy:hover { background-position: -75px 0; }
.mainnav li.active .philosophy { background-position: -100px 0; }
.mainnav .approach { top: 70px; background-position: -50px -70px;}
.mainnav .approach:hover { background-position: -75px -70px; }
.mainnav li.active .approach { background-position: -100px -70px; }
.mainnav .gallery { top: 140px; background-position: -50px -140px; }
.mainnav .gallery:hover { background-position: -75px -140px; }
.mainnav li.active .gallery { background-position: -100px -140px; }
.mainnav .legacy { top: 210px; background-position: -50px -210px; }
.mainnav .legacy:hover { background-position: -75px -210px; }
.mainnav li.active .legacy { background-position: -100px -210px; }
.mainnav .culture { top: 280px; background-position: -50px -280px; }
.mainnav .culture:hover { background-position: -75px -280px; }
.mainnav li.active .culture { background-position: -100px -280px; }
.mainnav .new { top: 350px; background-position: -50px -350px; height: 71px;}
.mainnav .new:hover { background-position: -75px -350px; }
.mainnav li.active .new { background-position: -100px -350px; }

.mainnav ul.alt_nav {top:2px;}

/*home*/
body.home .mainnav .philosophy { top: 0; background-position: 0 0;}
body.home .mainnav .philosophy:hover { background-position: -25px 0; }
body.home .mainnav .approach { top: 70px; background-position: 0 -70px;}
body.home .mainnav .approach:hover { background-position: -25px -70px; }
body.home .mainnav .gallery { top: 140px; background-position: 0 -140px; }
body.home .mainnav .gallery:hover { background-position: -25px -140px; }
body.home .mainnav .legacy { top: 210px; background-position: 0 -210px; }
body.home .mainnav .legacy:hover { background-position: -25px -210px; }
body.home .mainnav .culture { top: 280px; background-position: 0 -280px; }
body.home .mainnav .culture:hover { background-position: -25px -280px; }
body.home .mainnav .new { top: 350px; background-position: 0 -350px; height: 71px;}
body.home .mainnav .new:hover { background-position: -25px -350px; }
body.home .content{background-color:#000;}


/*------------------------------------------------------
HOME
------------------------------------------------------*/
.home_logo { position: absolute; right: 0; bottom: -40px; }
.billboard{position:relative;z-index:3000;}
#replay_tab {position:absolute; top:0; left:0; z-index:20;display:none;}

/*------------------------------------------------------
PHILOSOPHY
------------------------------------------------------*/
.phil_desc { width: 288px; position: absolute; top:57px; right:22px; font-size: 12px; line-height:18px;}
.phil_marks { position: absolute; left: 88px; top: 170px; }
.hd_see { position: absolute; left: 117px; top: 120px; }

/*------------------------------------------------------
APPROACH
------------------------------------------------------*/
.app_desc { width: 375px; position: absolute; top: 172px; left: 121px; line-height:18px; font-size: 12px; }
.hd_power { position: absolute; left: 85px; top: 112px; }
.app_marks { position:  absolute; right: 10px; top: 40px;  }
.app_nar{width:242px;}
.app_alt {position:relative; top:21px; left:17px;}

/*------------------------------------------------------
CULTURE
------------------------------------------------------*/
.cult_desc{ width: 208px; position: absolute; top: 163px; left: 121px; }
.cult_desc_r{position:absolute;top:112px;left:545px;width:242px;text-align:right;}
.cult_desc_l{ position: absolute; top: 110px; left: 120px;width:415px; font-size: 12px; line-height: 18px; }
.cult_desc_scroll{ height:262px; }
.bio_pic h3 { font-size: 14px; color: #13b3f0; margin: 8px 0 2px 0; text-transform:none; }
.bio_pic h4 { font-size: 11px; color: #939598; }

.brandmark_r{left:575px;}
.brandmark_l{width:400px;}
.cult_swf { position:absolute; right: 20px; top: 47px; }
.cult_links{position:absolute;bottom:12px;left:115px;text-transform:uppercase;font-weight:bold;font-size:10px;}

/*------------------------------------------------------
LEGACY
------------------------------------------------------*/
.carousel{position:absolute;top:103px;left:55px;width:735px;}
.carousel li{float:left;position:relative;}
.leg_sm_date{display:block;width:142px;height:17px;text-align:center;padding-bottom:17px;background:url(/_img/legacy/right_border.gif) no-repeat 0 1px;color:#00AEEF;font-size:17px;}
.leg_item{position:relative;width:147px;}
.leg_arrow{display:none;position:absolute;top:161px;left:63px;width:18px;height:15px;background:url(/_img/legacy/hover_arrow.png) no-repeat 0 0;}
.leg_thumb{padding-right:5px;height:142px;width:142px;}
.leg_copy{position:absolute;top:296px;width:100%;}
.leg_copy td{padding:4px; font-size: 12px;}
.leg_prev{top:189px;left:13px;background:url(/_img/gallery/identity/arrows_prev.jpg) no-repeat 0 -63px;}
.leg_next{top:189px;left:794px;background:url(/_img/gallery/identity/arrows_next.jpg) no-repeat 0 -63px;}
.x_cvr{width:5px;height:20px;position:absolute;top:0;left:0;z-index:200;background:#FFF;}
.content a.disabled{background-position:0 -63px;display:none;}


/*------------------------------------------------------
CONTACT
------------------------------------------------------*/
.hd_visit { position: absolute; top: 104px; left: 84px; }
.contact_info { position: absolute; left: 118px; top: 154px; }
.contact_info a { color: #808080; }
.contact_info h3 { color: #00ADEE; font-size: 11px; }
.contact_img { position: absolute; top: 45px; right: 40px; }

/*------------------------------------------------------
NEWS
------------------------------------------------------*/
.articles_wrap{position: absolute; top: 100px; left: 121px;}
.articles { width: 600px; height: 290px; overflow: auto; }
.articles li { margin-bottom: 20px; }
.n_date, .n_title { font-size: 18px; color: #13b3f0; }
.n_title { text-decoration: none; margin-right: 10px; }
.n_title:hover { color:#0C88B8; }
.n_return { position: absolute; top: 370px; left: 121px; }

/*------------------------------------------------------
NEWS SCROLLBAR
------------------------------------------------------*/
.jScrollPaneContainer {position:relative;overflow:hidden;z-index:1;outline:none;}
.jScrollPaneTrack {position:absolute;cursor:pointer;right:0;	top:0;height:100%;background:#aaa;display:none;}
a.jScrollArrowUp {display:block;position:absolute;z-index:1;top:0;right:0;text-indent:-2000px;overflow:hidden;height:22px;width:22px;background:url(/_img/news_up_arrow.jpg) no-repeat 0 -47px;}
a.jScrollArrowUp:hover {background-position:0 -23px;}
a.jScrollArrowDown {display:block;position:absolute;z-index:1;bottom:0;right:0;text-indent:-2000px;overflow:hidden;height:22px;width:22px;background:url(/_img/news_dn_arrow.jpg) no-repeat 0 -47px;}
a.jScrollArrowDown:hover {background-position:0 -23px;}


/*------------------------------------------------------
GALLERY
------------------------------------------------------*/
.gallery .content a{color:#666;text-decoration:none;}
.gallery .content a:hover{color:#333;}
.gallery .sub-0{text-transform:uppercase;font-weight:bold; position:relative;float:left;margin-left:12px; background:transparent url(/_img/gallery/vert_sep.png) no-repeat right 1px;padding-right:16px;}
.gallery .nobg{background:none;}
.gallery .sub-0 ul{position:absolute;width:200px;top:0;left:-20px; padding: 25px 0 30px 20px; background-image: url(/_img/spacer.png);}
.gallery .sub-0 a {font-size: 10px; color:#a1a2a3;}
.gallery .sub-level-0 a {font-family: Arial; font-size: 11px; line-height: 16px;}
.gallery .here a{color:#00aeef;}
.js .sub-0 ul{display:none;}
.gallery .active ul{display:block;}
.gallery .g_nav .active > a{color:#00aeef;font-size:14px;position:relative;top:-2px;}

.gallery .sub-0 ul li{font-weight:normal;text-transform:none;}
.gal_desc{position:absolute;top:111px;left:123px;width:186px;}
.g_copy{position:absolute;}
.g_copy h1{background-color:#FFF; color:#13b3f0; font-size: 14px; margin-bottom: 5px;}
.g_product{position:absolute;right:10px;bottom:55px;}
.g_nav{position:absolute;left:110px;top:364px;}
#linkPrev,#linkNext,.g_nav li ul{display:none;}
.js #linkPrev,.js #linkNext{display:inline;}

#g_num_nav{position:absolute;top:225px;}
#g_num_nav a { padding: 3px 5px; color: #a9aaac; }
#g_num_nav a.active { color: #00aeef; }

.js .fade{ display:none; }

.bi_img{position:absolute;top:55px;left:290px;}
.bi_arr{position:absolute;overflow:hidden;width:29px;height:29px;text-indent:-999em;}
.bi_prev{top:190px;left:225px;background:url(/_img/gallery/identity/arrows_prev.jpg) no-repeat 0 -63px;}
.bi_next{top:190px;left:640px;background:url(/_img/gallery/identity/arrows_next.jpg) no-repeat 0 -63px;}
a.bi_arr:hover{background-position:0 -31px;}
a.bi_arr:active{background-position:0 0;}

.gal_shelf { position: absolute; top:85px; left:97px; }
.gal_shelf a { margin-right: 10px; }
.gal_hd { position: absolute; top: 245px; left: 117px; }
.gal_overview { width: 240px; position: absolute; top: 238px; left: 500px; padding-left: 20px; border-left: 1px solid #ccc; line-height:16px; }
.gal_mini { position: absolute; top: 340px; left: 111px; }
.gal_mini a { display: block; text-indent: -999em; overflow: hidden; width: 116px; float: left; margin-right: 10px; height: 28px; }
.gal_mini a:hover { background-position: 0 -28px; }
.m_brand_id { background: url(/_img/gallery/home/btn_brandidentity.png) no-repeat; }
.m_sustain { background: url(/_img/gallery/home/btn_sustainability.png) no-repeat; }
.m_brandscape { background: url(/_img/gallery/home/btn_brandscaping.png) no-repeat; }

a#s_food:hover { color: #000; }


/*------------------------------------------------------
UTILS
------------------------------------------------------*/
.clear { clear: both; }
.fl_l { float:left; }
.fl_r { float: right; }
.hide { display:none; }
.bgrtxt { font-size:16px; line-height:21px; width:280px; }
.noscrub{outline:none;}