/*
*
* Purpose: Jupiter Design Global Stylesheet 
* Author: Aouse Al-Rawi
* (c)2008 Jupiter Design Ltd 
*
*/

/*********************************************************************************
*
* GENERAL STYLES
*
**********************************************************************************/
html{height: 100%;}
body{min-width:100%;height:100%;font-size:63%;text-align:center;background-color:#1b1b1b;}

*{padding:0px;margin:0px;}

h1{font:normal 4.2em Georgia, Arial, Helvetica;color:#fff;}
h1 span{background-color:#292929;padding:0px 0px 0px 0px;line-height:53px;}


h2{font:normal 1.8em Georgia, Arial, Helvetica;color:#FFF;margin:5px 5px 0px 0px;padding:0px 0px 0px 0px;}
h2 span{padding:0px 0px 0px 7px;border:0px solid red;}
h2 span a{font-family:Georgia, Arial, Helvetica;color:#FFF;text-decoration:none;font-size:1.0em;}

h3{font: normal 1.4em Georgia, Verdana, Arial;color:#FFF;border-bottom:1px dotted #666;margin:15px 15px 0px 15px;padding:0px 0px 5px 0px;}
h3 span{/*font-size:0.8em;*/}

p{font:normal 1.3em Arial, Verdana, Helvetica;color:#ACACAC;line-height:1.3em;padding:15px 15px 0px 15px;}
p.seo_test{font:normal 4.2em Georgia, Arial, Helvetica;color:#fff;padding:0px 0px 0px 0px;}
p.seo_test span{background-color:#292929;padding:0px 0px 0px 0px;line-height:53px;}

a{font-family:Arial,Georgia, Verdana;color:#FDE100;text-decoration:none;font-weight:normal;}
a:hover{text-decoration:underline;}
ul {margin:15px 15px 0px 27px;}
ul li{font: normal 1.2em Arial, Verdana, Helvetica;margin:0px 0px 5px 0px;padding-left:0px;list-style-image:url('../../images/buttons/bullet.gif');color:#ACACAC;}


.clear{clear:both;}
.rightFloat{float:right;}
.leftFloat{float:left;}

.jdTopMarginTiny{margin-top:30px;}
.jdTopMarginSmall{margin-top:90px;}
.jdTopMarginMedium{margin-top:120px;}
.jdTopMarginBig{margin-top:150px;}
.jdTopMarginLarge{margin-top:250px;}

.jdTinyText{font-size:1.1em;}
.jdSmallFont{font-size:1.3em;}
.jdMediumFont{font-size:1.5em;}
.jdBigFont{font-size:1.7em;}

.jdWhiteText {color:#FFF;}
.jdYellowText {color:#FDE100;}
.jdGreykText {color:#ACACAC;}
.jdBlackText {color:#333;}

.border{border:1px solid red;}
.jdNoShow{display:none;}
.linkCursor{cursor:pointer;}
/*******************************END***********************************************/


/*********************************************************************************
*
* Background Images
*
**********************************************************************************/

#home0{background-image:url('../../images/background/home_neon_tube.jpg');background-repeat:no-repeat;background-position:50% 0%;}
#home1{background-image:url('../../images/background/home_glitter_lights_1.jpg');background-repeat:no-repeat;background-position:50% 0%;}
#home2{background-image:url('../../images/background/home_glitter_lights_2.jpg');background-repeat:no-repeat;background-position:50% 0%;}
#home3{background-image:url('../../images/background/home-jam-1.jpg');background-repeat:no-repeat;background-position:50% 0%;}
#home4{background-image:url('../../images/background/home-jam-2.jpg');background-repeat:no-repeat;background-position:50% 0%;}

#who{background-image:url('../../images/background/who_we_are.jpg');background-repeat:no-repeat;background-position:50% 0%;}
#contactus{background-image:url('../../images/background/contact.jpg');background-repeat:no-repeat;background-position:50% 0%;}
#ourclients{background-image:url('../../images/background/our_clients.jpg');background-repeat:no-repeat;background-position:50% 0%;}
#work-with-us{background-image:url('../../images/background/jobs.jpg');background-repeat:no-repeat;background-position:50% 0%;}
#portfolio{background-image:url('../../images/background/our_portfolio.jpg');background-repeat:no-repeat;background-position:50% 0%;}
#accessibility{background-image:url('../../images/background/accessibility.jpg');background-repeat:no-repeat;background-position:50% 0%;}
#sitemap{background-image:url('../../images/background/site_map.jpg');background-repeat:no-repeat;background-position:50% 0%;}
#glossary{background-image:url('../../images/background/glossary.jpg');background-repeat:no-repeat;background-position:50% 0%;}
#error{background-image:url('../../images/background/404.jpg');background-repeat:no-repeat;background-position:50% 0%;}
#sprout{background-image:url('../../images/background/sprout_invaders.jpg');background-repeat:no-repeat;background-position:50% 0%;}


#caseCda{background-image:url('../../images/background/case_study_cda.jpg');background-repeat:no-repeat;background-position:50% 0%;}
#caseHeartOfGold{background-image:url('../../images/background/case_study_heart_of_gold.jpg');background-repeat:no-repeat;background-position:50% 0%;}
#caseMajesticare{background-image:url('../../images/background/case_study_majesticare.jpg');background-repeat:no-repeat;background-position:50% 0%;}
#caseSportLived{background-image:url('../../images/background/case_study_sport_lived.jpg');background-repeat:no-repeat;background-position:50% 0%;}
#caseWilkinsonRoomDesigner{background-image:url('../../images/background/case_study_wilkinson_room_designer.jpg');background-repeat:no-repeat;background-position:50% 0%;}


/*******************************END***********************************************/


/*********************************************************************************
*
* HEADER AND FOOTER
*
**********************************************************************************/
#header{width:inherit;background-color:#1b1b1b;padding:15px 0px 25px 0px !important;padding:10px 0px 10px 0px;}
#header #dividerH{border-top:1px dotted #666;height:1px;margin:5px 0px 0px 0px;width:inherit;}
#header #globalNavigation{vertical-align:bottom;margin-top:20px;}
#header #globalNavigation ul{text-align:left;margin:0px 0px 0px 2px;padding:0px;}
#header #globalNavigation ul li{display:inline;font:normal 1.3em Georgia, Arial, Verdana;color:#D5D5D5;margin:0px 3px 0px 0px;padding:0px;}
#header #globalNavigation ul li a{font-family:Georgia, Arial, Verdana;color:#D5D5D5;text-decoration:none;}
#header #globalNavigation ul li a:hover{text-decoration:underline;}
#header #globalNavigation .seperator{position:relative;top:-2px;}
#header #globalNavigation  .selected a{color:#FDE100;}
#header img{padding:0px;margin:0px;}

.footerOuter{height:110px; background-color:#1b1b1b;position:relative !important;position:absolute;left:0px;}
#footer{width:inherit;padding:25px 0px 15px 0px; background-color:#1b1b1b;}
#footer #dividerF{border-top:1px dotted #666;height:1px;margin:0px 0px 7px 0px !important;margin:0px;width:inherit;}
#footer ul{margin:0px 0px 0px 0px;}
#footer ul li{display:inline;font:normal 1.1em arial, verdana, helvetica;color:#ACACAC;margin:0px 0px 0px 0px;padding:0px;}
/*#footer p{font-size:1.0em;color:#999;display:inline;}*/
#footer a{color:#999;}
#footer a:hover{text-decoration:underline;}
#footer .footerLogos{margin:8px 0px 0px 0px;}
#footer .seperator{margin:0px 3px 0px 3px;}
/*#footer .rightside{margin-left:16px;}*/
#footer .leftside{margin-right:16px;}
#footer span a{color:#EBEBEB;}

#footer .footerLogos #digital, #facebook, #youtube, #flickr, #twitter{float:left;vertical-align:top;}

#footer .footerLogos #digital a{display:block;background: url(../../images/navigation/jupiter_digital_up.gif) 0px 0px no-repeat;width:137px;height:20px;}
#footer .footerLogos #digital a:hover{display:block;background: url(../../images/navigation/jupiter_digital_over.gif) 0px 0px no-repeat;width:137px;height:20px;}

#footer .footerLogos #facebook a{display:block;background: url(../../images/navigation/facebook_over.gif) 0px 0px no-repeat;width:14px;height:14px;}
#footer .footerLogos #facebook a:hover{display:block;background: url(../../images/navigation/facebook_up.gif) 0px 0px no-repeat;width:14px;height:14px;}

#footer .footerLogos #youtube a{display:block;background: url(../../images/navigation/youtube_over.gif) 0px 0px no-repeat;width:40px;height:16px;}
#footer .footerLogos #youtube a:hover{display:block;background: url(../../images/navigation/youtube_up.gif) 0px 0px no-repeat;width:40px;height:16px;}

#footer .footerLogos #flickr a{display:block;background: url(../../images/navigation/flickr_logo_up.gif) 0px 0px no-repeat;width:38px;height:12px;}
#footer .footerLogos #flickr a:hover{display:block;background: url(../../images/navigation/flickr_logo_over.gif) 0px 0px no-repeat;width:38px;height:12px;}

#footer .footerLogos #twitter a{display:block;background: url(../../images/navigation/twitter_logo_up.gif) 0px 0px no-repeat;width:53px;height:14px;}
#footer .footerLogos #twitter a:hover{display:block;background: url(../../images/navigation/twitter_logo_over.gif) 0px 0px no-repeat;width:53px;height:14px;}
  
#footer .footerLogos #jupiter a{display:block;background: url(../../images/navigation/jupiter_over.gif) 0px 0px
no-repeat;width:42px;height:50px;}
#footer .footerLogos #jupiter a:hover{display:block;background: url(../../images/navigation/jupiter_up.gif) 0px 0px no-repeat;width:42px;height:50px;}
/*******************************END***********************************************/


/*********************************************************************************
*
* CONTAINERS
*
**********************************************************************************/
.outer{margin:auto;width:924px;text-align:left;}
.jdImageContainer{}
.outerMain{margin:auto;padding:0px 0px 0px 0px;width:924px;text-align:left;}
.jdHeadFootContainer{background-color:#1b1b1b;width:inherit;}
.jdCentralArea{width:inherit;padding:30px 0px 30px 0px;}
.jdIntro{float:left;padding:0px 0px 35px 0px;}
.jdIntroLast{float:left;padding:0px 0px 0px 0px;}
.jdIntroWide{float:left;width:923px;padding:0px 0px 35px 0px;}
#jdWhatIntroArea{float:left;width:430px;margin:0px;}
#ourPortfolioB{width:inherit;margin:30px 0px 30px 0px;background-color:#161616;}
#twitter_div ul {margin:15px 15px 0px 15px;}
#twitter_div ul li{list-style-type:none;list-style-image:none;}
/*******************************END***********************************************/


/*********************************************************************************
*
* 4 BOX LOWER LAYOUT
*
**********************************************************************************/
.jdLowerPanel {padding-top:0px;}
.jdLowerPanelBox{margin-right:21px;}
.jdLastPanel{margin-right:0px;}
/*******************************END***********************************************/


/*********************************************************************************
*
* NORMAL BOXES
*
**********************************************************************************/
.jdInfoBoxOuter{float:left;width:215px;}
.jdInfoBoxOuterHome{float:right;width:450px;clear:both;margin-bottom:15px;}
.jdInfoBoxInnerHome{float:left;background-color:#292929;padding-bottom:15px;}

.jdInfoBoxInner{float:left;width:215px;background-color:#292929;padding-bottom:15px;}
.jdInfoBoxInnerHomeSmall{width:215px;background-color:#292929;padding-bottom:15px;min-height:113px;}

.jdInfoBoxInner img,.jdInfoBoxInnerHome img, .jdInfoBoxInnerHomeLower,#jdMattFlash, #jdAndyFlash, #jdChrisFlash{padding:15px 0px 0px 15px;}

.jdInfoBoxWide {width:452px;}
.jdInfoBoxWide .jdInfoBoxInner{width:452px;}
.jdInfoBoxWide .jdInfoBoxInner h3{font-size:1.8em;}
.jdInfoBoxWide .jdInfoBoxInner div{float:right;margin-left:15px;width:50%;}
.jdInfoBoxWide .jdInfoBoxInner div h3{font-size:1.6em;}

.operaFix{float:none;}

.secondBox{margin-left:20px;}

#jdLowerPanelBoxYellow{background-color:#FDE100;}
#jdLowerPanelBoxYellow ul li{list-style-image:url('../../images/buttons/bullet-yel.gif');color:#333;}
#jdLowerPanelBoxYellow a{color:#333;}
.jdCurrentJobs{height:200px;}
/*******************************END***********************************************/


/*********************************************************************************
*
* BUTTON / ARROW LINKS
*
**********************************************************************************/
.jdInfoAreaBtn{height:30px;background-color:#FDE100;float:right;padding-bottom:0px;cursor:pointer;}
.jdInfoAreaBtn img{float:left;margin:5px 5px 0px 10px;}
.jdInfoAreaBtn span a{font:normal 1.3em Georgia, Arial, Verdana;float:left;padding:6px;}
.jdInfoAreaBtn a{color:#000;}
.jdInfoAreaBtn2{width:107px;height:30px;background-color:#FDE100;float:left;margin-right:0px !important; margin-right:-3px;}
.jdInfoAreaBtn2 img{float:right;margin:6px 8px 0px 0px;}

.jdClientButton{float:left;height:30px;background-color:#292929;margin:0px 0px 2px 0px;padding:0px;}

.jdBackToTop{float:right;cursor:pointer;}
.jdBackToTop div{padding:4px 4px 4px 4px;background-color:#FDE100;}
.jdBackToTop a{margin:0px 7px 0px 0px;color:#000;font-family:Georgia, Arial,Verdana;font-size:1.1em;}
.jdBackToTop img{margin:0px 0px 0px 7px;}

.jdListPopUp{position:absolute;z-index:1;display:none;width:173px;height:120px;background-image:url('../../images/not-used/pop-up.gif');background-repeat:no-repeat;}
.jdListPopUp h3{color:#000;}
.jdListPopUp p{font-size:1.2em;color:#666;padding:5px 5px 10px 15px;}
/*******************************END***********************************************/


/*********************************************************************************
*
* PORTFOLIO TYPE CLIENT LIST LAYOUT
*
**********************************************************************************/
#jdPClients {padding-top:0px;float:left;width:705px !important;width:690px;}
.jdPClientsBox{background-color:#292929;height:53px;width:705px !important;width:690px;float:left;margin:0px 0px 10px 18px!important; margin:0px 0px 10px 9px;}

.jdPClientsBox .clientimage{float:left;width:123px;height:53px;}

.jdPClientsBox h3{float:left;font-size:2.8em;border:none;margin:0px 0px 0px 10px;padding:8px 0px 0px 0px;width:442px !important;width:432px;}
.jdPClientsBox h3 a{color:#FFF;font-family:Georgia, Arial, Verdana;}
.jdPClientsBox .clientsArrow{float:right;width:123px;height:53px;background-color:#FDE100;padding:0px;margin:0px;}
.jdPClientsBox .clientsArrow img{float:right;margin:10px 10px 0px 0px;}

.jdPClientsDetails {float:right;padding-top:0px;width:690px;height:500px;}
.jdLightbox{}

#jdFade img,#jdFade1 img,#jdFade2 img,#jdFade3 img{display:none;position:absolute;}
#jdFade .on,#jdFade1 .on,#jdFade2 .on,#jdFade3 .on{display:block;position:absolute;}
#ITT, #EMDA{margin-top:0px;}
#clients{margin-left:18px;margin-top:12px;}
/*******************************END***********************************************/


/*********************************************************************************
*
* Google Maps
*
**********************************************************************************/
#jdGoogleMap{width:422px;height:350px;border:15px solid #000;}
#jdGoogleMap h4{font:bold 1.6em Georgia,Arial,Verdana;padding:5px 15px 2px 15px;margin:0px;}
#jdGoogleMap span{font:bold 1.0em Arial,Verdana, Georgia;padding:5px 15px 2px 15px;margin:0px;}
#jdGoogleMap span a{color:#3250be;}
#jdGoogleMap .addressBar, #jdGoogleMap .btn{margin:5px 0px 5px 15px;width:110px;}
#jdGoogleMap div span{white-space:normal;font-size:0.9em;}
#directions{float:left;background-color:#FFF;font:normal 1.2em Arial, Verdana, Georgia;}
#jdGmapPop{padding-bottom:20px;}
/*******************************END***********************************************/


/*********************************************************************************
*
* Footer pages
*
**********************************************************************************/
#jdSitemap{width:auto;float:left;}
#jdSitemap ul{margin-left:20px !important;margin-left:15px;}
#jdSitemap ul .normal{margin:10px 0px 10px 0px;}
#jdSitemap ul .indent{margin:0px 0px 5px 40px;padding-left:0px;}

#jdGlossary{width:925px;background-color:#292929;}
#jdGlossary .jdGlossInner{float:left;width:190px;margin:20px !important;margin:16px;}
#jdGlossary .jdGlossInner h3{margin:0px;}
#jdGlossary .jdGlossInner p{padding:10px 0px 0px 0px;line-height:1.4em;}
/*******************************END***********************************************/


/*********************************************************************************
*
* showcase styles
*
**********************************************************************************/
#lbOverlay {position: absolute;left: 0;width: 100%;background-color: #000;cursor: pointer;}
#lbCenter {position: absolute;left: 50%;/*overflow: hidden;*/background-color: #fff;}
#lbBottomContainer {position: absolute;left: 50%;overflow: hidden;background-color: #fff;}

.lbLoading {background: #fff url(../../images/visuals/loading2.gif) no-repeat center;}
#lbImage {position: absolute;left: 0;top: 0;border: 20px solid #fff;;background-repeat: no-repeat;}
#lbPrevLink, #lbNextLink {display: block;position: absolute;top: 0;width: 50%;outline: none;z-index:30;}
#lbPrevLink {left: -114px;}
#lbPrevLink/*:hover*/ {background: transparent url(../../images/buttons/overlay_left_arrow.gif) no-repeat 0% 50%;}
#lbNextLink {right:-114px;}
#lbNextLink/*:hover */{background: transparent url(../../images/buttons/overlay_right_arrow.gif) no-repeat 100% 50%;}
#lbBottom {font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;font-size: 10px;color: #666;line-height: 1.4em;text-align: left;border: 20px solid #fff;border-top-style: none;}
#lbCloseLink {display: block;float: right;width: 23px;height: 23px;background: transparent url(../../images/buttons/overlay_close_btn.gif) no-repeat center;margin: 0px 0px 0px 0px;}
#lbCaption, #lbNumber {margin-right: 71px;}
#lbCaption {font-weight: bold;}
/*******************************END***********************************************/



/*********************************************************************************
*
* slider tab styles
*
**********************************************************************************/
#sliderContainer{position:relative;overflow:hidden;height:0px;margin-top:15px;}
#slider{width:215px;height:0px;}
#sliderSection0{position:absolute;top:0px;margin:0 0 0 15px;width: 186px; background-color: #292929 }
#sliderSection1{position:absolute;top:20px;margin:0 0 0 15px; width: 186px; background-color: #292929; }
#sliderSection2{position:absolute;top:40px;margin:0 0 0 15px; width: 186px; background-color: #292929; }
#sliderSection3{position:absolute;top:60px;margin:0 0 0 15px; width: 186px; background-color: #292929;}
.sliderTabs span { line-height: 1.1em; font: normal 13px arial,verdana,sans-serif; display: block; }
#sliderTab0, #sliderTab1, #sliderTab2, #sliderTab3 { height: 20px;background-color:#292929; }
#sliderTab0 span, #sliderTab1 span,#sliderTab2 span,#sliderTab3 span  { cursor:pointer; color:#fff;} 	
.sliderSelected #sliderTab0,.sliderSelected #sliderTab1,.sliderSelected #sliderTab2,.sliderSelected #sliderTab3  { background-color:#535353; padding:5px 3px 0 3px;}
#sliderSection0.sliderSelected, #sliderSection1.sliderSelected, #sliderSection2.sliderSelected, #sliderSection3.sliderSelected, .sliderSelected .sliderTabs { background-color: #292929;color:#fff;}
#sliderScroll0 p,#sliderScroll1 p,#sliderScroll2 p,#sliderScroll3 p{padding:5px 5px 10px 1px;}
/*******************************END***********************************************/


/*********************************************************************************
*
* slider tab styles
*
**********************************************************************************/
#sliderContainer{position:relative;overflow:hidden;height:0px;margin-top:15px;}
#slider{width:215px;height:0px;}
#sliderSection0{position:absolute;top:0px;margin:0 0 0 15px;width: 186px; background-color: #292929 }
#sliderSection1{position:absolute;top:20px;margin:0 0 0 15px; width: 186px; background-color: #292929; }
#sliderSection2{position:absolute;top:40px;margin:0 0 0 15px; width: 186px; background-color: #292929; }
#sliderSection3{position:absolute;top:60px;margin:0 0 0 15px; width: 186px; background-color: #292929;}
.sliderTabs span { line-height: 1.1em; font: normal 13px arial,verdana,sans-serif; display: block; }
#sliderTab0, #sliderTab1, #sliderTab2, #sliderTab3 { height: 20px;background-color:#292929; }
#sliderTab0 span, #sliderTab1 span,#sliderTab2 span,#sliderTab3 span  { cursor:pointer; color:#fff;} 	
.sliderSelected #sliderTab0,.sliderSelected #sliderTab1,.sliderSelected #sliderTab2,.sliderSelected #sliderTab3  { background-color:#535353; padding:5px 3px 0 3px;}
#sliderSection0.sliderSelected, #sliderSection1.sliderSelected, #sliderSection2.sliderSelected, #sliderSection3.sliderSelected, .sliderSelected .sliderTabs { background-color: #292929;color:#fff;}
#sliderScroll0 p,#sliderScroll1 p,#sliderScroll2 p,#sliderScroll3 p{padding:5px 5px 10px 1px;}
/*******************************END***********************************************/