/* This is a comment */
/* Style Sheet for BakaBunny Design*/


/**************** GENERAL TAGS FOR ALL PAGES  *****************/
/* url below fixes hover for IE6*/
body { 
behavior: url("csshover3.htc"); 
} 

body {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
font-style: normal;
line-height: 120%;
font-weight: normal;
font-variant: normal;
text-transform: none;
/*smoothes fonts to be anti-alias*/
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;
color: #303030;
/* centers content to browser window*/
text-align: center;
padding: 0;
margin: 0;
background: url("../imagesPage/back_tile.jpg") repeat-x center top;
width: 100%;
height: 100%;
background-color: #252f32;
xborder: 1px red solid;


/* prevents text from being selectable*/
-moz-user-select: none;
-khtml-user-select: none;
user-select: none;
}

/* prevents button outlines*/
/*for FireFox*/
button::-moz-focus-inner { border: 0; }

input[type="submit"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner
    {   
        border : 0px;
    } 
/*for IE8 */
    input[type="submit"]:focus, input[type="button"]:focus
    {     
        outline : none; 
    }
 

.paragraph {
font-weight: normal;
} 

.paragraphBold {
font-weight: bold;
}


hr {
height:2px;
border:none;
background-color: #ddd;
}

.textWhite{
	color: #999999;
}


.captionText{
	font-size: 12px;
	color: #CCCCCC;
	font-weight: bold;
}

.captionTextDark{
	font-size: 12px;
	color: #333333;
	font-weight: bold;
}


/*this removed dotted outlines from around link objects when clicked on in firefox*/
a {
   outline: 0;
}

hr {
height:2px;
border:none;
background-color: #ddd;
}

.linkText{
	font-weight: bold;
	color: #6284b9;
}

.textWhite{
	color: #999999;
}

a:link {
	color: #FFFFFF;
	text-decoration: none;
}
a:hover {
	color: #7aa3cc;
	text-decoration: underline;
}
a:visited {
	text-decoration: none;
	color: #303030;
}
a:active {
	text-decoration: none;
}

/*this removed dotted outlines from around flash objects when clicked on in firefox*/
object, embed {
  outline: 0;
}


h1 {
	font-size: 16px;
	font-weight: bold;
}
h2 {
	font-size: 14px;
	font-weight: bold;
}


.bulletList{
list-style: square;
}



/**************** CONTENT AREA FOR ALL PAGES *****************/

#justBacking{
width:100%;
min-width:1024px; 
xborder: 1px solid green;
background: url("../imagesPage/back_whole.jpg") no-repeat center top;
overflow:hidden;
}

#wholePage{
position:relative;
z-index:1;
margin-left: auto;
margin-right: auto;
text-align: left;
width:1024px;
height: 768px; 
overflow:hidden;
xborder: 1px solid green;
}

#Content{
width:1024px;
height: 662px; 
xborder: 1px solid yellow;
}


/**************** TOP NAV *****************/
#topNav{ 
height: 100px;
z-index:100;
xborder: 1px solid red;
}

#bakaLogo{
border:0px;
z-index:100;
}

/*BEGIN BUTTON FOR TOP NAV*/
#navButtons{
width: 625px;
position:relative; 
left: 350px;
top: -95px;
overflow: hidden;
xborder: 1px solid red;
}

#navButtons a.active {
	background-position:right;
	xborder: 1px solid red;
}

.myButtonLink {
	display: block;
	width: 125px;
	height: 40px;
	text-indent: -99999px;
	float:left;
	overflow: hidden;
	xborder: 1px solid red;
}
.myButtonLink:hover {
	background-position:right;
}


.navInteractive {
	background: url('../imagesPage/nav_interactive.gif') left;
}

.navDesign {
	background: url('../imagesPage/nav_design.gif') left;
}

.navMotion {
	background: url('../imagesPage/nav_motion.gif') left;
}

.navImaging {
	background: url('../imagesPage/nav_imaging.gif') left;
}

.navContact {
	background: url('../imagesPage/nav_contact.gif') left;
}
.navFloat {
clear: both;
}

/*END BUTTONS FOR TOP NAV*/



/**************** FOOTER *****************/
#footer{
position:relative;
top:-25px;  
height: 30px;
xborder: 1px solid orange;
}

.footerText{
	font-size: 12px;
	color: #FFFFFF;
xborder: 1px solid orange;
}

/*BEGIN BUTTON FOR FOOTER*/
#footerButtons{
width:175px;
height:30px;
position:relative;
top:-25px;
left:840px;
xborder: 1px solid green;
}

.footerLinkedin{
xposition:relative; 
xmargin-left: 30px;
}

.footerFlickr{
xposition:relative; 
xmargin-left: 17px;
}

.footerFacebook{
xposition:relative; 
xmargin-left: 10px;
}

/*END BUTTONS FOR FOOTER*/


/**************** ALL PAGE ACCESSORIES *****************/
.pageTitle{
	height:70px;
	width: 254px;
	text-align: left;
	xposition:relative;
	xtop:108px;
	xleft: 120px;
	background: url('../imagesPage/panel_pageTitle.jpg');
	background-repeat:no-repeat;
	xborder: 1px solid #CCCCCC;
/* allows right content to move right */
float:left;
}

.titleGif{
margin: 15px 20px 35px 20px;
}

/**************** WELCOME PAGE ACCESSORIES *****************/

.welcomeText{
	height:65px;
	width: 525px;
	position:relative;
	top:-25px;
	left: 400px;
	background: url('../imagesPage/home_welcome.png');
	background-repeat:no-repeat;
}

.homeDescription{
	height:305px;
	width: 330px;
	position:relative;
	top:-5px;
	left: 10px;
	background: url('../imagesPage/home_paragraph.png');
	background-repeat:no-repeat;
/* allows right content to move right */
float:left;
}

.slidePanel{
	height:540px;
	width: 610px;
	text-align: left;
	position:relative;
	top:-20px;
	left: 25px;
	background: url('../imagesPage/panel_photos.png');
	background-repeat:no-repeat;
	overflow:hidden;
	xborder: 1px solid red;
/* allows right content to move right */
float:left;
}


#showArea{
	position:relative;
	top:19px;
	xleft: 1px;
	z-index:10;
}

.homeBlueCurve{
    height:160px;
	width: 880px;
	text-align: left;
	position:relative;
    top: -145px;
	left: 141px;
	overflow:hidden;
	clear:both;
	xborder: 1px solid red;
}

.homeBlueBase{
    height:74px;
	width: 880px;
	background: url('../imagesPage/home_bluecurve.png');
	background-repeat:no-repeat;
	z-index:15;
	overflow:hidden;
	xborder: 1px solid red;
}

.homeBlueTip{
    height:86px;
	width: 174px;
	position:relative;
	left: 708px;
	background: url('../imagesPage/home_bluecurvetip.png');
	background-repeat:no-repeat;
	z-index:16;
	overflow:hidden;
	xborder: 1px solid red;
}


/**************** INTERACTIVES PAGE ACCESSORIES *****************/
.interactiveText{
	height:86px;
	width: 545px;
	position:relative;
	top: -1590px;
	left: 360px;
	z-index:10;
	background: url('../imagesPage/interactive_text.png');
	background-repeat:no-repeat;
}

.interactiveText .chromeText{
	height:40px;
	width: 750px;
	position:relative;
	top: 80px;
	left: -25px;
	z-index:11;
}

.interactiveText .chromeText, .interactiveText .chromeText a{
	font-size: 12px;
	color:#3366FF;
	font-weight:bold;
	z-index:11;
}

/**************** FLASH PAGE ACCESSORIES *****************/


/*positions thumbnail carousel*/
#wrapInteractives{
	position: relative;
    top: 100px;
    left: 55px
}

.scrollBacking{
    height:575px;
	width: 197px;
	position:relative;
	top: -1601px;
	left: 37px;
	z-index: -10;
	background: url('../imagesPage/panel_scrollerVert.png');
	background-repeat:no-repeat;
}

.interBlueCurveTop{
    height:118px;
	width: 238px;
	position:relative;
	top: -2200px;
	left: 25px;
	z-index: -5;
	xbackground: url('../imagesPage/interactive_bluewaveTop.png');
	background-repeat:no-repeat;
}


.interBlueCurveBot{
    height:84px;
	width: 237px;
	position:relative;
	top: -1803px;
	left: 37px;
	z-index: -6;
	background: url('../imagesPage/interactive_bluewaveBottom.png');
	background-repeat:no-repeat;
}


.slidePanel835{
	height:540px;
	width: 760px;
	xtext-align: left;
	position:relative;
	top:-400px;
	left: 250px;
	xborder: 1px solid green;
}

#showCaptionHere{
width: 760px;
height:40px;
text-align: center;
z-index: 20;
xborder: 1px solid red;
}


#showImageHere{ 
    xposition:absolute;
    position:absolute;
    xtop:50px;
    top:0px;
    height:540px;
    width: 760px;
    xz-index:10;
    z-index:50;
	text-align: center;
	xborder: 1px solid orange;

}

#showBackingHere{
    height:540px;
	width: 760px; 
    position:relative;
	top:-941px;
	left: 250px;
	z-index:-1;
	xz-index:12;
	xborder: 1px solid orange;

}


.writeimageChunk{
    text-align: center;
    xborder: 1px solid red;
}

/**************** ANIMATION PAGE ACCESSORIES *****************/
.animationText{
	height:86px;
	width: 545px;
	position:relative;
	top: -1590px;
	left: 360px;
	z-index:10;
	background: url('../imagesPage/animation_text.png');
	background-repeat:no-repeat;
}

.animationText .chromeText{
	height:40px;
	width: 750px;
	position:relative;
	top: 80px;
	left: -25px;
	z-index:11;
}

.animationText .chromeText, .animationText .chromeText a{
	font-size: 12px;
	color:#3366FF;
	font-weight:bold;
	z-index:11;
}


/**************** DESIGN PAGE ACCESSORIES *****************/
.designText{
	height:86px;
	width: 685px;
	position:relative;
	top: -5px;
	left: 180px;
	z-index:10;
	background: url('../imagesPage/design_text.png');
	background-repeat:no-repeat;
}



/**************** ACCORDIAN MENU CONTENT *****************/

.imageChunk{
width:170px;
text-align: center;
padding: 8px 5px 0px 5px;
xborder: 1px solid blue;
}

/* floats the text to the left of the thumbnails */
.imageFloatRight{
float:right;
overflow: hidden;  
}

.imageFloatLeft{
float:left;  
overflow: hidden;
}

.imageNoFloat{
clear: both; 
overflow: hidden;
}

/* floats entire row and creates rows of images */
.row1 {
float:left;
xborder: 1px solid orange;
}


.row2 {
clear: both;
xborder: 1px solid purple;
}



/**************** TABBED CONTENT PAGE ACCESSORIES - CONTACT PAGE *****************/

#tabContent{
	position:relative;
	top: 0px;
	left: 50px;
}

#scroller-header a {
	text-decoration:none; 
	color:#867863; 
	padding:0 15px 0 55px;
}

#scroller-header a:hover {
	text-decoration:none; 
	color:#4b412f
}

a.selected {
	text-decoration:underline !important; 
	color:#4b412f !important;
}

#scroller-header {
	xbackground:url(images/header.gif) no-repeat;
	background:#ffffff;
	width:900px;
	height:24px;
	padding:35px 0 0 0px;
	font-weight:700;
}

#scroller-body {
	xbackground:url(images/body.gif) no-repeat bottom center;
	background:#ffffff;
	width:900px;
	padding-bottom:30px;
}

#mask {
	width:800px;
	overflow:hidden;
	margin:0 auto;
}

#panel {

}

#panel div {
float:left;
}

#panel div .panelContent{
padding:30px 0px 30px 0px;
xborder: solid 1px red;
}

#panel-1 {
}

#panel-2 {
}

#panel-3 {
}


/**************** RESUME.HTML ONLY *****************/
table{
position:relative;
top:10px;
width: 800px;
border-collapse: collapse;
border-spacing: 10px 0px;
xborder: 1px solid red;
}	

.boxMid{
width: 500px;
vertical-align: text-top;
margin: 5px 5px 5px 15px;
padding: 15px 5px 15px 15px;
border-bottom: 1px solid #cccccc;
}

.boxRight{
width: 300px;
font-size: 80%;
text-align: right;
vertical-align: text-top;
margin: 5px ;
padding: 5px;
border-bottom: 1px solid #cccccc;
}

.companyName{
font-size: 110%;
font-weight: bold;
xcolor: #497db1;
}

