/*   
Theme Name: Open Utopia
Description: custom theme for theopenutopia.org
Author: theCoup
Author URI: http://theCoup.org
Template: twentyten
Version: 0.9

Credits:
Background texture on #main by Dan Cederholm of Simple Bits

*/

	/* watch twentyten updates to style! transpose here. */
@import url('../twentyten/style.css');




/** =colors 
********************************************/

.sherbert { color:rgb(254,217,129); background:rgb(254,217,129); }
.darkblue { color:rgb(44,55,70); background:rgb(44,55,70); }
.slate { color:rgb(60,53,47); background:rgb(60,53,47); }
.burnt-red {  background:rgb(178,59,36); }

body { 
 background:rgb(3,4,5);
 }

a:link, a:visited { 
 color:rgb(44,55,70);
 color:rgb(217,86,0); 
 color:rgb(204,34,34); 
  color:rgb(178,59,36);
 }
a:active, 
a:hover, 
.widget-area a:hover, 
.entry-title a:hover,
.entry-meta a:hover, 
.entry-utility a:hover {  
 text-decoration:none;  
 color:white; 
 background:rgb(217,86,0); 
 background:rgb(204,34,34); 
  background:rgb(178,59,36);
 }

.entry-meta a, 
.entry-utility a {  
  color:#666;
	}
 


/** =site title
********************************************/
 

#site-title  { 
 position:relative;  
 top:70px; left:295px;
  }
  
body.home #site-title , body#splash #site-title  { 
 top:240px;
 }
 
  
#site-title a { 
 display:block;
 width:350px; height:90px;
 height:0; padding:90px 0 0; overflow:hidden; /* img txt replacement: see: http://www.mezzoblue.com/tests/revised-image-replacement  */ 
 background:transparent url(images/open-utopia.jpg) top center no-repeat; 
 }
#site-title a:hover { 
 background-position:bottom center; 
 }

#site-description { display:none; }


/** =structure 
********************************************/


#wrapper { padding:0; }

#header { 
 height:200px; 
 background:rgb(56,68,84) url(images/banner.jpg) bottom center no-repeat;
 }
body.home #header, body#splash #header { 
 height:370px; 
 background-position:top center;
 }
 
#access {
 top:50px;
 }
 
#main { 
 background:rgb(246,234,212) url(images/dan-cederholm-is-the-greatest-2.jpg) top left repeat;
 background:rgb(246,234,212) url(images/bkg.jpg) top left repeat;
 } 
 
#container { ; } 
#content { ; }

#primary { ; }
#footer { ; }

#access, #access .menu-header, div.menu, #colophon, #branding, #main, #wrapper {
 /* margin: 0px auto;
 width: 900px; */
 }


 
/** =forms 
********************************************/

#content form p { margin-bottom:0; }

div.wpcf7 {
 float:left;
 width:40%;
 clear:both;
}

input[type="file"] { /* any style triggers ugly inset drop shadow  */ }

.wpcf7-list-item { display:block; }

#text-5 form { margin:1em 0; }
#text-5 form p { margin:0 0; }




/** =sharing
********************************************/

div.sharing {
clear:both;
}

/** =widgets 
********************************************/


#text-4 h3, 
#text-6 h3, 
#text-8 h3, 
#text-10 h3,
#twitter-tracker-3 h3 { 
 display:none; 
 }

h3.widget-title { 
 font-size:1.4em; 
 margin-bottom:.5em; 
 }

#rethink-widgets { /* rethink twitter */
 float:left;
 top:-46px; /* hack alert! */
 margin-left:10%;
 padding-left:3%;
 width:40%;
 border-left:3px solid rgb(218,206,185); /* fallback for IE */
 border-left:3px solid rgba(60,53,47,0.1); 
} 
#rethink-widgets h3 { 
 font-family: Georgia, "Bitstream Charter", serif;
 font-weight:normal;
 font-size:1.1em; 
 margin-bottom:0; 
 } 
 
#twitter-tracker-3  { 
 margin-top:1.25em;
 }

#twitter-tracker-3 ol,#twitter-tracker-3 ul,#twitter-tracker-3 li  { 
 list-style:none;
 margin-left:0;
 }

#twitter-tracker-3  { 
 margin-top:1em;
 }

#twitter-tracker-3 div.avatar img { 
 float:left; 
 margin-right:10px; 
 }
 
 
	/* home introduction blurb */
#text-3 { 
 color:white;
 color:rgba(255,255,255,0.9);
 background:rgb(44,55,70);
 margin:0 0 2em;
 padding:1em 14px 1.25em;
 }
#text-3 h4 { display:none; }
#text-3 a { 
 color:white;
 color:rgba(255,255,255,0.9);
 text-decoration:none;
 padding:0 2px;
 }
#text-12 a:hover { ; }

	/* download options */
#text-5, #text-12 { 
 padding:.5em 10px;
 border:1px dotted rgb(175,167,150); 
 border-color:rgba(0,0,0,0.2); 
 -moz-border-radius: 4px;
 -webkit-border-radius: 4px;
 border-radius: 4px;
 background:transparent;
 background:rgba(255,255,255,0.2);
}
#text-5 h3, #text-12 h3{ 
 color:#000;
 color:rgba(0,0,0,0.8);
}


	/* share buttons */
#text-10 li  {
 display:block; float:none;
}

	/* above search box */
#secondary.widget-area {
 margin-top:1em;
 padding-top:1em;
 border-top:3px solid rgb(218,206,185); /* fallback for IE */
 border-top:3px solid rgba(60,53,47,0.1); 
}

	
/** =marginalia
********************************************/

span.marginalia { 
 display:block; 
 float:right;
 position:relative; 
 max-width:33%;
 left:30px;
 margin:1em 0 1em 5px;
 padding:.5em 10px;
 font-style:italic;
 font-size:.9em;
 border-left:3px solid rgb(218,206,185); /* fallback for IE */
 border-left:3px solid rgba(60,53,47,0.1); 
 background:rgb(214,200,176);
 background:rgba(0,0,0,0.03);
}


/** =button links 
********************************************/

a.button, 
p.button a, 
.widget-area p.button a,
div.slideshow-nav a { 
 padding:.25em 15px;
 margin:0;
 font-weight:bold;
 text-align:center;
 background:rgb(204,34,34); 
 background:rgb(178,59,36); 
 color:white !important; 
 text-decoration:none !important;
 font-family:"Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;
 font-size:.8em;
 }
#content .home-column p.button { margin-bottom:0px; }

.widget-area p.button a { 
 display:block;
 margin:.5em 0;
 background:#777;
 font-size:1.2em;
 color:white;
 }
a.button:hover, 
p.button a:hover,
.widget-area p.button a:hover,
div.slideshow-nav a:hover { 
 background:#3C352F; 
 text-decoration:none;
 }
 
 
#content a.socialbook { 
 float:right; 
  margin:.5em 10px;

 } 

 
div .sociable { border-top:1px solid #ddd; padding-top:.25em; }
div .sociable_tagline { font-size:.9em; }
div .sociable_tagline span { ; }
.sociable a:hover { background:none; }

/** =rethink 
********************************************/

body.page-id-213 #content { width:900px;} /* rethink */
body.page-id-25 #content { width:900px;} /* look photos */

#content p.rethink a {
 float:left;
 height:220px;
 width:290px;
 margin:0 10px 2em 0;
 background:rgb(194,186,160) url(images/rethink-buttons.jpg) top left no-repeat; 
 height:0; padding:220px 0 0; overflow:hidden; /* img txt replacement: see: http://www.mezzoblue.com/tests/revised-image-replacement  */ 
}

#content p.rethink a#rethink-video:hover { background-position:0px 0px; }
#content p.rethink a#rethink-video { background-position:0px -220px; }

#content p.rethink a#rethink-photos:hover { background-position:-290px 0px; }
#content p.rethink a#rethink-photos { background-position:-290px -220px; }

#content p.rethink a#rethink-audio:hover { background-position:-580px 0px; }
#content p.rethink a#rethink-audio { background-position:-580px -220px; }

.wpaudio-container a { color:#666!important; background:none; }

.wpaudio-container .wpaudio-slide { display:none!important; }

/** =audio player
********************************************/

.player-container { /* haiku player */
	padding-bottom:0 !important;
	margin-bottom:.5em;
}

.haiku-button a.play:hover { 
	background:#666; 
}

.player-container img.listen { 
	/* width:81px; height:15px; */
}

 
/** =images
********************************************/

#content p.slideshow-title {
 font-weight:bold;
 font-size:1.2em;
 margin-bottom:0;
}
p.slideshow-caption {
 font-style:italic;
}

.slideshow-nav {
 font-size:1.2em;
}

dl.gallery-item {
 margin-bottom:.5em;
}
.gallery img {
 border: 2px solid #fff !important;
 -moz-border-radius: 4px;
 -webkit-border-radius: 4px;
 border-radius: 4px;
 -webkit-box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.1);
 -moz-box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.1);
 box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.1);
}

 
/** =menu main
********************************************/


#access {
 background:none;
 width:500px; 
 margin:0 150px; /* ( 940 - (5 x 120px) ) / 2 */
}
body.home #access, body#splash #access {
 top:220px;
}

#access a {
 color:#ccc;
 font-size:1.1em;
 width:100px;
 text-align:center;
 background:transparent;
 background:rgba(255,255,255,0.1);
 }
#access a:hover {
 background:transparent;
 background:rgba(255,255,255,0.2);
 }

 


/** =contents menu 
********************************************/

#nav_menu-3 { margin-bottom:2em; }
#nav_menu-3 h3.widget-title { font-size:1.4em; }
#nav_menu-3 ul  { 
 list-style:none; 
 margin:1em 0 0 !important; 
 padding:0; 
 }

#nav_menu-3 li.menu-item { 
 list-style:none; 
 margin:0 0 .75em; 
 padding:.25em 10px .25em 4px; 
 border-color:rgba(0,0,0,0.2); 
 border-left:4px solid rgb(175,167,150); 
 line-height:1.1em; 
 }
#nav_menu-3 li.menu-item:hover { 
 border-color:rgb(178,59,36); 
 background:rgb(223,212,191);
 background:rgba(255,255,255,0.4);
 }
#nav_menu-3 li.menu-item a { margin:0; padding:0;  }
#nav_menu-3 li.menu-item a:hover { color:black; background:none; text-decoration:none; }

#nav_menu-3 { ; }

#nav_menu-3 li.current-menu-item {
 border-color:rgb(178,59,36);  
 background:rgb(223,212,191);
 background:rgba(0,0,0,0.066);
}




/** =posts 
********************************************/


.meta-sep,
.author {
 display:none;
 }

/** =footnotes
********************************************/

	/* <sup><a>22</a></sup> */

a.footnoteref {
 font-weight:bold;
 padding:1px;
 font-size:.7em;
 vertical-align:super;
 line-height:1em;
}
sup a.footnoteref {
 vertical-align:inherit;
 font-size:1.1em;
}
a.footnote {
}



div.footnotes {
 margin:1em 0;
 padding:1em 10px; 
 border-top:3px solid rgb(218,206,185); /* fallback for IE */
 border-top:3px solid rgba(60,53,47,0.1); 
}
div.footnotes ol { ; }



/** =homepage 
********************************************/

.home-column { 
 float:left;  
 width:45%; 
 margin-right:4%;
 }

#home-image { 
 border-left:3px solid rgb(218,206,185); /* fallback for IE */
 border-left:3px solid rgba(60,53,47,0.1); 
 width:42%;
 padding-left:2%;
}
#home-image .the-image { 
 height:231px; /* keeps more image button even with video to the left */
}


#home-news, #home-excerpt {
 margin-top:1em;
 padding-top:1em;
 border-top:3px solid rgb(218,206,185); /* fallback for IE */
 border-top:3px solid rgba(60,53,47,0.1); 
}

#home-excerpt .home-post {
 padding:1em 30px 0; 
 background:transparent url(images/quote-open.gif) top left no-repeat;
 }
#home-excerpt .home-post p {
 padding-bottom:1.5em;
 margin-bottom:-.5em;
 background:transparent url(images/quote-close.gif) bottom right no-repeat;
 font-size:1em; 
 font-style:italic; 
 font-weight:bold;
 text-shadow: 0px 1px 0px rgba(255,255,255,.33); /* engraved: 33% white from bottom */
 }

#content .home-column h3 { 
 font-size:1.2em;
 color:#999;
 font-weight:bold;
 }
#content .home-column h3 a { 
 text-decoration:none;
 }

#content .home-post h3 a { 
 /* color:rgb(60,53,47); */
 text-decoration:none;
 }
#content .home-post h3 a:hover { 
 color:white;
 }



#home-feature a.more-link { /* set in functions.php */
 display:none;
}
#content a.more-ellipses { ; }

 
/** =footer 
********************************************/

#footer {
 color:white;
 background:rgb(44,55,70);
}
#footer a { color:white; }
#footer a:hover { text-decoration:underline;}

#site-credit {
 float:right; 
 width:220px; 
 margin-right:20px;
 text-align:right;
 font-style:italic;
 }

#site-info {
 width:400px;
 margin-left:20px;
 font-weight:normal;
 font-size:1em;
}
 
 
/** =clearfix 
********************************************/
	/* self clear floats for all, ie, and ie7 */

div { display:block; position:relative; }

.clearfix:after, .container:after, .feature-group:after, .menu ul:after {content:".";display:block;height:0;clear:both;visibility:hidden;}
* html .clearfix, * html .container, *html .feature-group, * html .menu ul {height:1%;}
.clearfix, .container, .feature-group, .menu ul {display:inline-block;}
.clearfix, .container, .feature-group, .menu ul {display:block;}

br.clearfix { width:99%; clear:both; }

/** =css3 
********************************************/

.rounded, 
#wrapper, 
a.button, p.button a, 
div.slideshow-nav a,
#text-3, 
body#splash #header {
 -moz-border-radius: 4px;
 -webkit-border-radius: 4px;
 border-radius: 4px;
 }

.shadow, #wrapper {
 -webkit-box-shadow: 1px 3px 9px rgba(0, 0, 0, 0.6);
 -moz-box-shadow: 1px 3px 9px rgba(0, 0, 0, 0.6);
 box-shadow: 1px 3px 9px rgba(0, 0, 0, 0.6);
 }



/** =live adjustments 
********************************************/


.widget-area a.coming-soon:hover {
  color:rgb(178,59,36);
  background:none;
  text-decoration:line-through;
  cursor:default;
}

.hidden { display:none; } /* can be used to prevent widget titles */

#branding img { display:none; }

#site-credit {
 float:right; 
 width:220px; 
 text-align:right;
 font-style:italic;
 }

#site-info {
 font-weight:normal;
 font-size:1em;
}