/* 

Theme Name: RoySakuma.net
Author: Jerry Stephens
Author URI: http://wayofthegeek.org

Copyright 2008 Roy Sakuma Productions
Site design and development by PCF Virtual, www.pcfvirtual.com */


/*********** HTML ELEMENTS ***********/
body {
	font-family: Arial, Helvetica, Sans-Serif;
	background: url(asseimg/background.jpg) #005691 repeat-x;;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	color: #000;}
	
a img {
	border: none;
}
	 
	
	

/*********** LINKS ***********/
a:link, a:visited { color: #5c2e00; }
a:hover { color: #CC6600; }
a:active { color: #5c2e00 !important; }




/*********** GENERAL STYLES ***********/
.colclear { width: 100%; height: 1px; background: none; clear: both;}
.colclearhome { height: 4px; width: auto; clear: both; background: #FFF; }
.spacer { height: 1px; background: none;}
.japanlink { margin-right: 10px; float: right; margin-top: 1px; }
.featureimg { padding: 3px; background: #FFF; border: 1px solid #C1C1C1; margin-bottom: 5px; }
div#homecontent {
    background: url('assets/img/home-columnbkgd.gif');
    min-height: 1200px;
    padding: 0;
    margin: 0;
}
.hometext { 
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 17px;
	color: #000000;
        border-top: none;
        padding: 10px;
}
.hometext p { margin-top: 0px; margin-bottom: 10px; width: 472px; }
#homehighlights img{ display: block; margin: 5px auto; }
#homehighlights { 
        text-align: center; 
        line-height: 17px; 
        font-size: 12px; 
        padding: 10px; 
}
#homehighlights p { margin-top: 0; margin-bottom: 10px; width: 225px; }
.greentable1 { background: #CEEAB5; text-align: center; vertical-align: top; }
.greentable2 { background: #B5E48C;  text-align: center; vertical-align: top; }
.ukulelestudiosnav { padding: 10px; border-bottom: 1px solid #cbdcb9;  border-top: 1px solid #cbdcb9; text-align: center; margin: 5px 0; clear: both; }
.ukulelestorenav { padding: 10px; border-bottom: 1px solid #cbdcb9;  border-top: 1px solid #cbdcb9; text-align: center; margin: 5px 0; clear: both; }
.rsproductionsnav { padding: 10px; border-bottom: 1px solid #cbdcb9;  border-top: 1px solid #cbdcb9; text-align: center; margin: 5px 0; clear: both;background: #edf8e2; }



/*********** HOME PAGE STYLES ***********/
#maincontainer { width: 994px; font-size: 14px; line-height: 20px; height: auto; background: #FFFFFF; margin: 0 auto; border-bottom: 1px solid #003366;  border-left: 1px solid #003366;  border-right: 1px solid #003366; z-index: 2;}
#header { width: 994px; height: 22px; background: url(assets/img/top-bkgd.jpg) repeat-x #ea6b00; text-align: right; }
#column01 { float: left; width: 220px; padding: 10px; margin: 0; background: #FFF; text-align: left; z-index: 5; height: 100% !important;}
#column02 { float: left; width: 744px; margin: 0px; padding: 10px 5px; background: #FFF; text-align: left; }
#flash { height: 222px; width: 742px; padding: 0px; margin: 0 0 0px 0; background: #FFF; border: 1px solid #C1C1C1;  }
#nav {  padding: 3px; width: 212px; margin: 0 0 10px 0; background: #FFF; border: 1px solid #C1C1C1; vertical-align: top;  }
#homecontent { width: 744px; padding: 0px; margin: 0 0 10px 0; background: #FFF url(asseimg/home-columnbkgd.gif) repeat-y;   }
#homeleft {  background: none; float: left; width: 492px; margin-right: 5px; }
#homeright {  background: none; float: left; width: 247px; }








/*********** INSIDE PAGE STYLES ***********/
#insidecontent { float: left; margin: 0px 0 10px 0; width: 736px; padding: 3px; background: #FFF; border: 1px solid #C1C1C1; text-align: left; }
.insideimghd { border-bottom: 1px solid #FFFFFF; margin: 0; padding: 0; }
.insidelogo { text-align: center; padding-bottom: 10px; }
#greenbody { padding: 20px; background: #edf8e2; width: 696px; }
#tanbody { padding: 20px; background: #fffdd6; width: 696px; }
#bluebody { padding: 20px; background: #e1f5fe; width: 696px; }







/*********** HEADERS ***********/


h1 { font-size: 14px; height: auto; color: #5c2e00; font-family: Georgia, "Times New Roman", Times, serif;  padding-bottom: 5px; padding-top: 0px; line-height: 25px; font-weight: bold; margin-top: 0; margin-bottom: 0; }

h1.studiopageheaders { font-size: 18px; height: auto; color: #5c2e00; font-family: Georgia, "Times New Roman", Times, serif;  padding-bottom: 5px; padding-top: 0px; line-height: 25px; font-weight: normal; margin-top: 20px; margin-bottom: 0; text-align: center; }

h2 { font-size: 120%; letter-spacing: 1px; color: #FFF; font-family: Arial, Helvetica, sans-serif; font-weight: bold; margin-top: 10px; margin-bottom: 10px; }

h3 { font-size: 120%; color: #FFF; font-family: Arial, Helvetica, sans-serif; margin-top: 10px; margin-bottom: 0px; }

h4 { font-size: 120%; color: #FFF; margin-top: 0; margin-bottom: 0; font-family: Arial, Helvetica, sans-serif; font-weight: normal; line-height: 160%; }


#header h1 span { display: block; position: relative; z-index: 1; }
/* IE5 Mac Hack \*/ #header h1 { overflow: hidden; } /*/ #header h1 { text-indent: -100em; } /* End Hack */

#content h1 span { display: block; position: relative; z-index: 1; }
/* IE5 Mac Hack \*/ #content h1 { overflow: hidden; } /*/ #content h1 { text-indent: -100em; } /* End Hack */

#content h2 span { display: block; position: relative; z-index: 1; }
/* IE5 Mac Hack \*/ #content h2 { overflow: hidden; } /*/ #content h2 { text-indent: -100em; } /* End Hack */

#content h3 span { display: block; position: relative; z-index: 1; }
/* IE5 Mac Hack \*/ #content h3 { overflow: hidden; } /*/ #content h3 { text-indent: -100em; } /* End Hack */


#hd-weeklypoll, #hd-weeklypoll span { color: #000; height: 38px; width: 228px; background: url(asseimg/hd/hd-weeklypoll.gif) no-repeat; margin: 0;  }
#hd-weeklypoll span { margin-bottom: -38px; }

#hd-awardsphotos, #hd-awardsphotos span { color: #000; height: 38px; width: 221px; background: url(asseimg/hd/hd-awardsphotos.gif) no-repeat; margin: 0;  }
#hd-awardsphotos span { margin-bottom: -38px; }

#hd-oscarsquiz, #hd-oscarsquiz span { color: #000; height: 38px; width: 245px; background: url(asseimg/hd/hd-oscarsquiz.gif) no-repeat; margin: 0;  }
#hd-oscarsquiz span { margin-bottom: -38px; }

#hd-sweepstakes, #hd-sweepstakes span { color: #000; height: 38px; width: 300px; background: url(asseimg/hd/hd-sweepstakes.gif) no-repeat; margin: 0;  }
#hd-sweepstakes span { margin-bottom: -38px; }






 




/*********** FOOTER ***********/
#footer { width: 952px; background: #fffdd6; color: #000;  font-size: 12px;  clear: both; margin: 0 auto; padding: 10px; text-align: center;  border: 1px solid #C1C1C1; }

#footerlinks { width: 954px; height: auto; margin: 0; background: none; }
#footerlinks ul {  margin-top: 0; margin-bottom: 0;  text-align: center; list-style: none; display: inline; }
#footerlinks li { list-style: none; display: inline; padding: 0 2px;  margin: 0 .5em 0 -.5em;  }

#bottom { width: 994px; height: 29px; margin: 10px 0 0 0; padding: 0px; background: url('assets/img/bottom-bkgd.jpg') repeat-x #ff9906; }






/*********** BLOG ***********/
/*#insidecontent{
    min-height: 800px;
    border: 1px solid #CCC;
    }*/
.post{
    width: 500px;
    float: left;
    padding: 0;
    height: auto;
    margin: 0;
    font: normal 14px sans-serif;
	z-index: 1;
    }
.blognavhd{
    padding: 0 0 10px 0;
}
#blognavcontainer{
    padding: 0;
    margin: 0 0 20px 0;
	width: 160px;
	height: auto;
    }
#blognavcontainer ul {
padding: 0;
margin: 0;

}
li.cat-item a {
    padding: 8px 5px !important;
    background: #fdeeb0;
    display: block;
    width: 160px;
    }
#blog-leftcol{
    width: 500px;
}
#blog-rightcol, #blog-leftcol{
    float: left;
}
#blog-rightcol li {
list-style-type: none;
vertical-align: center;
}
#blog-rightcol a {
display: block;
padding: 5px;
width: 160px;
font: normal 1.1em sans-serif;
background-color: #fdeeb0;
border-bottom: 1px solid #FFF;
color: #5c2e00;
text-decoration: none;
height: auto;
margin: 0;
   }
#blog-rightcol a:hover, #blog-righcol li:hover{
background-color: #fce275;
color: #5c2e00;
}
.blogdate{
    font: bold 16px sans-serif;
    color: #666;
    }
.blogheader, .blogheader a{
    font: bold 16px sans-serif;
    text-decoration: none;
    }
.blogcomment{
    border-top: 1px solid #fce275;
    border-bottom: 1px solid #fce275;
    padding: 5px;
    width: 450px;
    margin: 0 auto;
    color: #333;
    font: normal 11px sans-serif;
    }
.blogdiv{
    padding: 0;
    margin-bottom: 0px;
    }
#tanbody img{
    max-width: 600px;
    }
#history-list {
    width: 100%;
    text-align: center;
    font: normal 14px sans-serif;
    line-height: 20px;
    }
#history-list a{
    padding: 5px 0;
    }
.comment{
    list-style-type: none;
    }
#photos {
    width: 605px;
    margin: 0 auto;
    padding: 10px 5px;
    background: #FFF;
    border: 1px solid #707070;
    z-index: 0;
    }
div#ui0 {
    width: 100%;
    border-top: 1px solid #707070;
    margin-top: 10px;
    padding-top: 5px;
    }
div#ui0 a {
    text-decoration: none;
}
.menu2 {
    z-index: 20 !important;
    }
.menu2 a:link, .menu2 a:hover,.menu2 a:active {
    text-decoration: none !important;
}
.menu2 ul {
    z-index: 2000 !important;
}
span#date {text-align: center; display: block; width: 700px; margin: 0 auto;}
    div#history
    {
        position: relative;
        width: 700px !important;
        margin: 0 auto;
    }
    div#history div.bodytext
    {
        display: none;
        position: relative;
        top: 0;
        left: 0;
        width: 700px;
    }
    /* 
	root element for the scrollable. 
	when scrolling occurs this element stays still. 
*/
div.scrollable {
	
	/* required settings */
	position:relative;
	overflow: hidden;	 	
	width: 600px !important;	
	height: 1000px;	
	
	
	/* custom decorations */
}

/* 
	root element for scrollable items. Must be absolutely positioned
	and it should have a super large width to accomodate scrollable items.
	it's enough that you set width and height for the root element and
	not for this element.
*/
div.scrollable div.items {	
	/* this cannot be too large */
	width:20000em;	
	position:absolute;
	clear:both;		
	
	/* decoration */
}

/* single scrollable item */
div.scrollable div.items div.bodytext {
	float:left;
	
	/* custom decoration */
        display: block;
	text-align:justify;
	width:580px;
        height: 1000px;
        padding: 0 10px;
	margin-right: 20px;	
}

/* active item */
div.scrollable div.items div.gallery img.active {
background: #0f0;
width: 200px;
}
/* this makes it possible to add next button beside scrollable */
div.scrollable {
	float:left;	
}

/* prev, next, prevPage and nextPage buttons */
a.prevPage, a.nextPage {
	width:18px;
	height:18px;
	float:left;
	margin:43px 10px 0 10px;
	cursor:pointer;
	font-size:1px;
}

/* mouseover state */
a.prev:hover, a.next:hover, a.prevPage:hover, a.nextPage:hover, a.left span:hover, a.right span:hover {
	background-position:0px -18px;		
}

/* disabled#navlinksal button */
a.disabled {
	visibility:hidden !important;		
}

/* next button uses another background image */
a.nextPage, a.right span {
	background-image:url(img/scrollable/arrow/right.png);
        float: right;
        margin: 0;
        margin-top: 5px;
        margin-right: 330px;
}
a.prevPage,a.left span {
	background-image:url(img/scrollable/arrow/left.png);
        float: right;	
        margin: 0;
        margin-right: 30px;
        margin-top: 5px;
}


/*********** navigator ***********/


/* position and dimensions of the navigator */
div.navi {
	margin: 0 auto;
	width:300px;
	height:20px;
}
ul.tabs {
    padding: 0;
    margin: 0 auto;
    width: 480px;
}
ul.tabs li {
    display: block;
    float: left;
    margin: 2px 0;
    text-align: center;
    list-style-type: none;
    color: #5c2e00;
    cursor: pointer;
    padding: 0 5px;
}
ul.tabs li.middle {
    border-left: 1px solid #666;
}
ul.tabs li.second {
    padding-left: 0;
}

ul.tabs li.active {
    font-weight: bold;
}

/* items inside navigator */
div.navi a {
	width:8px;
	height:8px;
	float:left;
	margin:3px;
	background:url(img/scrollable/arrow/navigator.png) 0 0 no-repeat;
	display:block;
	font-size:1px;
}

/* mouseover state */
div.navi a:hover {
	background-position:0 -8px;      
}

/* active state (current page state) */
div.navi a.active {
	background-position:0 -16px;     
} 	
a.left span, a.right span {
    height: 18px !important;
    width: 18px !important;
    }

a.nextyear {
    display: none;
    }
		.slideShow ul, .slideShow li {
			list-style-type: none;
			margin: 0px;
			padding: 0px;
			float: left;
		}
.photos {width: 625px!important; min-height: 400px; display:block; margin: 0 auto;}
.slide { width: 625px!important; height: 400px!important; display: block; text-align: center;}
.slide img, .slide .selected img {  display:block; height: 400px !important; width: auto; margin: 0 auto;}
#navlinks { text-align: center; width: 300px; padding: 5px 0; margin: 0 auto;}
#navlinks ul#buttons { width: 100%;  list-style-type: none;  clear: both; display:block; }
#navlinks ul#buttons li, #navlinks ul#buttons li img { width: 75px;  height: 20px;  background: transparent; display: block; float: left; } 
#navlinks ul#buttons li a.first,#navlinks ul#buttons li a.prev,#navlinks ul#buttons li a.next,#navlinks ul#buttons li a.last { width: 75px; text-align: center;}
#navlinks ul #buttons li a.first img,#navlinks ul#buttons li a.prev img,#navlinks ul#buttons li a.next img,#navlinks ul#buttons li a.last img { height: 20px !important; width: 75px !important;}
#photo_thumbs ul { width: 625px; list-style-type: none; padding: 0; margin: 0; float: left; }
#photo_thumbs li{ width: 125px !important; height: 110px; display: block; float: left; padding: 0; text-align: center; overflow: hidden; }
a.page img { height: 82px; width: auto; margin: 0 auto; text-align: center; }
a.page { text-align: center; display: block; width: 100%; height: 100%;}
                		/* slideshow styles */
		.slideShow {
			background: #FFF;
			padding: 10px 0; 
			border: 1px solid #B3B3B3;
			margin-bottom: 10px;
		}
		.slideShow #photo_thumbs {
                    width: 625px !important;
                    margin: 0 auto;
			margin-top: 10px;
			display: block;
		}
		.slideShow #photo_thumbs a {
			background-color: none;
			margin: 0px 2px 0px 0px;
			padding: 3px 8px;
			color: #232323;
			text-decoration: none;
			float: left;
			font-size: 0.8em;
		}
		.slideShow ul.to#photo_thumbs {
			margin: 0px 0px 40px 0px;
		}
		.slideShow .thumbs #navlinks a:hover, .slideShow .thumbs #photo_thumbs a.selected {
			background-color: none;
			color: #000000;
		}
                #photo_thumbs img { width: auto; margin: 0 auto;}
                #photo_thumbs img, #navlinks img {opacity:0.4;filter:alpha(opacity=40); margin: 0 auto;}
		#photo_thumbs a:hover img, #photo_thumbs a.selected img, #navlinks a:hover img {
                    opacity:1;filter:alpha(opacity=100);
                    }
		/** slides with more than an image in it **/
		.slide li {
                    position: relative;
					float: left;
					height: 400px;
					width: 625px;
					list-style-type: none;
					padding: 0;
					margin: 0;
                }
		.slide h1 {
			position: absolute;
			background-color: #ffffff;
			left: 0px;
			top: 0px;
		}
		
		/** slideshow with images in#navlinks **/
		#photo_thumbs.white a, #photo_thumbs.white li {
			background-color: #ffffff;
		}
		#thumbs {
			display: block;
		}
		#iefix {
height: 400px;
width: 625px;
clear: left;
}
ol.wp-paginate li {
    list-style-type: none;
    display: block;
    float: left;
    padding: 5px;
}
ol.wp-paginate li a{
        text-decoration: none;
}
object, embed {
    z-index: 1 !important;
}
div.kjo-link p  { display: none; }
img.vidthumb {
    height: 50px;
    width: 67px;
    padding: 20px 26px;
}
.ngg-album-desc { line-height: 18px; }
.ngg-album-compact { height: 180px !important; }
input#url, label[for=url] {
    display: none;
}
#flash_player, #flash_player small,#flash_player object {
    float: left;
    color: #FFF;
}
#flash_player object {
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 3px;
}

#cartEmptyText {
    color: #5c2e00;
}
.blogtext {
    margin: 0;
    height: auto !important;
}

#lessonForm { font-size: 12px; }
.stdFieldContainer { margin: 4px 0; }