/*
Theme Name: Nanika 2010
Theme URI: http://www.nanikawa.com/
Description: Nanika Wordpress Theme.
Version: 0.1
Author: Andreas Muller
Author URI: http://www.andreasmuller.org/
Tags: 

	Nanika Wordpress Theme.

*/


/* ------------ Main -------------*/ 

/* Reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
ol,ul {list-style:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;}
q:before,q:after{content:'';}




body
{
    background-image:url('http://wordpress.nanikawa.com/images/backgroundbottom.png');
	background-repeat:repeat-x;
	background-attachment:fixed;
	background-position:bottom; 
	        
	background-color:rgb(235, 235, 235);
}

/* Selection color */ 
::selection {
        background: rgb(210, 210, 210); /* Safari */
        }
::-moz-selection {
        background: rgb(210, 210, 210); /* Firefox */
}


/* Give paragraphs a little bit of padding */

p {
	padding-bottom:5px;
	padding-top:5px;	
	padding-left:0;
	padding-right:0;
}


#SiteDiv {
	position: absolute;
	/*border: 1px solid black;	*/
	top: 16px;
	width: 978px;
	/*background-color: #CCFFCC;*/	
	left: 50%; 
	margin-left: -489px; 	
	margin-right: auto ;		
}


.container {
	width: 500px;
	height: 500px;
	border: 1px solid black;
}


/* ------------ Font -------------*/ 

@font-face {
    font-family: OptimaEmbedded;
    src: url('font/OptimaLTStd-Medium.otf');
}


/* ------------ Gallery hack -------------*/ 

/* will this remove the gallery padding ?*/

.gallery-item
{
	margin-top: -7px !important; /* The !important part makes it override the margin-top set later on*/ 
}




/* ------------ Menu -------------*/ 

#MenuDiv {
	/*text-shadow: 1px 0px rgb(196,196,196);*/
	text-shadow: 1px 1px rgba(0,0,0,0.2);
	position: absolute;
	/*border: 1px solid black;*/	
	/*background-color: #FFCCCC;*/	
	right: 0px;
	top: 0px;	
	font-family: OptimaEmbedded, sans-serif;
	font-size: 18px;
	color: rgb(95,95,95);
}	

a.MenuTextLink:link 	{ color: rgb(95,95,95); text-decoration: none; }
a.MenuTextLink:visited 	{ color: rgb(95,95,95); text-decoration: none; }
a.MenuTextLink:hover 	{ color: rgb(95,95,95); text-decoration: underline; }
a.MenuTextLink:active 	{ color: rgb(95,95,95); }	

/* ------------ Ticker -------------*/ 


#Ticker{
	border-style:none;
	
	/*border: 1px solid black;*/
	
	position: absolute;
	left: 0px;
	top: 0px;
	
	width:978px;		
}


#TickerDiv {

	position: relative;
	margin-bottom:  50px; /* This pushes the hero images down, and any content below */ 
	
	margin-top: 	25px; 	
	margin-left: 	0px; 
	margin-right: 	0px; 
	
	
	/*left: 1024px;*/
	/*top: 89px;*/	
	
	/*left: 0px;*/
	/*top: 78px;*/

	font-family: OptimaEmbedded, sans-serif;
	
	/*border: 1px solid black;*/
}

.TickerTextMain {
	color: rgb(47,47,47);
	text-shadow: 1px 1px rgba(0,0,0,0.12);
	font-size: 12px;
}		

.TickerTextSecondary {
	color: rgb(141,141,141);
	text-shadow: 1px 1px rgba(0,0,0,0.12);
	font-size: 10px;
}	

a.TickerTextLink:link {color: rgb(47,47,47); text-decoration: none; }
a.TickerTextLink:visited {color: rgb(47,47,47); text-decoration: none; }
a.TickerTextLink:hover {color: rgb(47,47,47); text-decoration: underline; }
a.TickerTextLink:active {color: rgb(47,47,47); }


/* ------------ Hero -------------*/ 

#HeroImageDivNew {

	position: relative;

	width:978px;
	height:550px;
		
	/*border: 1px solid green;*/
}


ul#HeroImagesFade li img{
	border-style:none;
	
	position: relative;
/*	left: 978px;*/
	top: 0px;		
	/*border: 1px solid red;*/
}


ol,ul {
	list-style:none;
	/*border: 1px solid black;*/
	
	position: absolute;
/*	left: -978px;*/
	top: 0px;		
}
	

/* ------------ Projects -------------*/ 


#ProjectsDiv {
	width: 988px;
	
	overflow: auto;
	position: relative;
	right: 0px;
	top: 0px;	
	
	margin-top: 30px;
	
	font-family: OptimaEmbedded, sans-serif;	
	/*border: 1px solid red;*/
}

	
.ProjectsThumbnailAndTextDiv {
	float: left;	
	
	position: relative;		
	
	margin-right: 9px;
	margin-bottom: 8px;	
	
	width: 320px;
	height: 350px;
}

.ProjectsTitleDiv {
	position: relative;		
	color: rgb(95,95,95);
	text-shadow: 1px 1px rgba(0,0,0,0.12);
	font-size: 17px;	
}


img {
	text-decoration: none;
	border:none;
}

/*
a:link, a:visited { text-decoration: none; } 
a:hover, a:active { text-decoration: underline; } 
*/

.ProjectsThumbnailDiv {
	position: relative;		
	margin-top: 7px;	
	
	border-bottom: none !important;
	text-decoration: none !important;	
}

a.ProjectsThumbnailDiv:link 	{ text-decoration: none !important; }
a.ProjectsThumbnailDiv:visited 	{ text-decoration: none !important; }
a.ProjectsThumbnailDiv:hover 	{ text-decoration: none !important; }
a.ProjectsThumbnailDiv:active 	{ text-decoration: none !important; }

.ProjectsExcerpt {
	font-size: 12px;	
	color: rgb(50,50,50);	
	text-shadow: 1px 1px rgba(0,0,0,0.12);	
}
	
.ProjectsDate{
	font-size: 10px;	
	color: rgb(95,95,95);
	text-shadow: 1px 1px rgba(0,0,0,0.12);
}

a.ProjectsLink:link 	{ color: rgb(95,95,95); text-decoration: none; }
a.ProjectsLink:visited 	{ color: rgb(95,95,95); text-decoration: none; }
a.ProjectsLink:active 	{ color: rgb(95,95,95); }
a.ProjectsLink:hover 	{ color: rgb(95,95,95); text-decoration: underline; }

img.ProjectsLink:hover  { text-decoration: none !important; }


/* ------------ News -------------*/ 

#NewsPostsDiv {

	position: relative;
	right: 0px;
	top: 0px;	
	
	margin-top: 30px;
	
	font-family: OptimaEmbedded, sans-serif;	
	/*border: 1px solid red;*/
}




/* ------------ Blog -------------*/ 

#BlogPostsDiv {

	position: relative;
	right: 0px;
	top: 0px;	
	
	margin-top: -30px;
	
	
	font-family: OptimaEmbedded, sans-serif;	
	/*border: 1px solid red;*/
}


#BlogPagesLinks {

	position: relative;
	
	margin-top: 15px;


	font-family: OptimaEmbedded, sans-serif;	

	text-shadow: 1px 1px rgba(0,0,0,0.12);		
	
	font-size: 14px;	
	color: rgb(50,50,50);	
	
}

.BlogPageLinkNewer {
	float: left;
}

.BlogPageLinkOlder {
	float: right;
}


.BlogPageLinkNewer A:link 		{ color: rgb(0,0,0); text-decoration: underline; }
.BlogPageLinkNewer A:visited 	{ color: rgb(0,0,0); text-decoration: underline; }
.BlogPageLinkNewer A:active 	{ color: rgb(0,0,0); text-decoration: underline; }
.BlogPageLinkNewer A:hover 		{ color: rgb(0,0,0); text-decoration: underline; }

.BlogPageLinkOlder A:link 		{ color: rgb(0,0,0); text-decoration: underline; }
.BlogPageLinkOlder A:visited 	{ color: rgb(0,0,0); text-decoration: underline; }
.BlogPageLinkOlder A:active 	{ color: rgb(0,0,0); text-decoration: underline; }
.BlogPageLinkOlder A:hover 		{ color: rgb(0,0,0); text-decoration: underline; }


/* The one above is BlogPost__s__Div, the one below is BlogPostDiv */
.BlogPostDiv {

	width: 977px;
	
	/*overflow: auto; this was causing scrollbars to appear*/
	
	position: relative;
	right: 0px;
	top: 0px;	
	
	margin-top: 60px;
	
	text-shadow: 1px 1px rgba(0,0,0,0.12);		
	
	font-size: 13px;	
	color: rgb(50,50,50);	
	
	/*border: 1px solid red;*/
}

.BlogPostDiv A:link 		{ color: rgb(0,0,0); text-decoration: underline; }
.BlogPostDiv A:visited 		{ color: rgb(0,0,0); text-decoration: underline; }
.BlogPostDiv A:active 		{ color: rgb(0,0,0); text-decoration: underline; }
.BlogPostDiv A:hover 		{ color: rgb(0,0,0); text-decoration: underline; }

.BlogPostDateDiv {

	position: relative;
		
	margin-bottom: 2px;
	
	color: rgb(50,50,50);	

	font-size: 10px;
}

.BlogPostFlickrLinkSpan {

	position: relative;

	margin-top: 5px;		
	margin-bottom: 0px;
	
	color: rgb(50,50,50);	

	font-size: 10px;
}

.BlogPostTitleDiv {

	position: relative;
		
	margin-bottom: 10px;
	
	color: rgb(0,0,0);	

	font-size: 25px;
}

.BlogPostImageDiv {

	position: relative;
		
	margin-top: 0px;
	margin-bottom: 10px;
	
}


a.BlogPostFlickrLink:link 	{ 		color: rgb(50,50,50); text-decoration: underline; }
a.BlogPostFlickrLink:visited 	{ 	color: rgb(50,50,50); text-decoration: underline; }
a.BlogPostFlickrLink:hover 	{ 		color: rgb(50,50,50); text-decoration: underline; }
a.BlogPostFlickrLink:active 	{ 	color: rgb(50,50,50); }	

/* ------------ About -------------*/ 

#AboutDiv {

	position: relative;
	right: 0px;
	top: 0px;	

	color: rgb(65,65,65);	
	
	margin-top: 30px;
	
	font-size: 13px;	
	font-family: OptimaEmbedded, sans-serif;	
	/*border: 1px solid red;*/
}

.AboutTitle
{
	color: rgb(0,0,0);	
	font-size: 25px;
}

.AboutLargerHeadline
{
	color: rgb(35,35,35);	
	font-size: 16px;
}



/* ------------ Footer -------------*/ 


#FooterDivNew {

	position: relative;
	margin-top: 50px;	/*border: 1px solid black;*/
	margin-bottom: 40px;
}


#HrDivNew {
	position: relative;
	width: 978px;
	right: 0px;
	top: 0px;	
	/*border: 1px solid black;*/
}

#FooterTextDivNew {
	position: relative;
	
	/*right: 0px;*/
	/*top: 35px;*/
		
	margin-top: 25px;
		
	font-family: OptimaEmbedded, sans-serif;	
	font-size: 12px;
	/*border: 1px solid black;*/
}

.FooterTextDarker {
	color: rgb(0,0,0);
	text-shadow: 1px 1px rgba(0,0,0,0.12);
}		

.FooterTextLighter {
	color: rgb(47,47,47);
	text-shadow: 1px 1px rgba(0,0,0,0.12);
}


.roundedBoxSpan {
	-moz-border-radius: 8px;
	border-radius: 8px;
	
	background-color: rgb(94,94,94);
	
	padding-left: 5px;
	padding-right: 5px;

	padding-top: 2px;
		
	color: rgb(255,255,255);
	text-shadow: 1px 1px rgba(0,0,0,0.12);
	
	border-bottom:outset 1.0px rgba(0,0,0,1.0);
	border-right:outset 1.0px rgba(0,0,0,1.0); 		
} 

a.mailtoLink:link 		{ color: rgb(255,255,255); text-decoration: none; }
a.mailtoLink:visited 	{ color: rgb(255,255,255); text-decoration: none; }
a.mailtoLink:hover 		{ color: rgb(255,255,255); text-decoration: underline; }
a.mailtoLink:active 	{ color: rgb(255,255,255); }	


/* ------------ Project -------------*/ 


#ProjectDiv {
	position: relative;
	right: 0px;
	top: 35px;	
	font-family: OptimaEmbedded, sans-serif;	
	font-size: 14px;
	color: rgb(101,101,101);
	
	padding-bottom: 40px;
		
	/*border: 1px solid red;*/
}

#ProjectTopDiv {
	position: relative;
	margin-bottom: 10px;
}

#ProjectClientYearDiv {

	position: relative;
	margin-bottom: 10px;

	font-size: 16px;	
}

		
.ProjectClientYearDarkerText {
	color: rgb(0,0,0);
}

.ProjectTitleText {
	color: rgb(0,0,0);
	font-size: 27px;
}		

.ProjectDateText {

	font-size: 10px;
}		


.ProjectBodyText {
	letter-spacing: 0.5px;
}


.ProjectBodyText A:link 		{ color: rgb(0,0,0); text-decoration: underline; }
.ProjectBodyText A:visited 		{ color: rgb(0,0,0); text-decoration: underline; }
.ProjectBodyText A:active 		{ color: rgb(0,0,0); text-decoration: underline; }
.ProjectBodyText A:hover 		{ color: rgb(0,0,0); text-decoration: underline; }



img {
	border: none;
}


/*
ul#Ticker li img{
	border-style:none;
	
	border: 1px solid black;
	
	position: absolute;
	left: 0px;
	top: 0px;		
}	
*/
