/* 
Theme Name: Conservancy for Tibetan Art and Culture
Theme URI: http://tibetanculture.org
Description: A custom WordPress theme for CTAC
Version: 1.0
Author: Andrea Mignolo 
Author URI: http://andreamignolo.com


Copyright Conservancy for Tibetan Art and Culture 2009

*/


/*-------------------------------------------    

    Overrides

-------------------------------------------*/

html, body, form, fieldset, h1, h2, h3, h4, h5, h6, pre, blockquote, ul, ol, dl, address, .more-link  { margin:0; padding:0; }
a, a:link, a:visited { outline: none; text-decoration: none; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; }


/*-------------------------------------------    

    Layout

-------------------------------------------*/

#wrapper { width: 960px; margin: 0 auto; overflow: hidden; padding: 0 10px; }
#masthead { width: 225px; background: url(images/masthead_bg.jpg) top center #720000 no-repeat; overflow: hidden; float: left; height: 1000px; margin-right: 10px; }
#main { float: left; width: 720px; overflow: hidden;}
#nav { width: 100%; overflow: hidden;}
#nav ul { list-style-type: none; clear: right; margin-top: 20px; float: right;}
#nav ul li { float: left; display: inline; }
#nav ul li a { color: #8f1b11; display: block; padding: 0 10px; text-transform: uppercase; font-size: 14px; border-left: 1px solid #f5db56; }
#nav ul li:first-child > a { border-left: none; }
#nav ul li.current_page_item a { color: #CC6600; }
#search { float: right; margin-top: 10px; margin-bottom: 8px; }
#featured { clear: both; margin-left: 20px; }
#column { width: 100%; overflow: auto; background: url(images/bg.png) top left repeat-y; }


#gallery { margin-left: 20px; margin-top: 20px; }
#intro_quote { margin-top: 15px; margin-left: 20px; clear: both; }
#intro_quote h2 { text-indent: -9999px; width: 698px; height: 104px; background: url(images/quote1.jpg) center no-repeat; }
#secondary_quote { margin-left: 30px; margin-top: 40px; width: 90%; overflow: hidden; margin-bottom: 15px;}
#secondary_quote img { float: left; margin-right: 30px;}
#secondary_quote h2 { float: left; margin-left: 20px; text-indent: -9999px; width: 577px; height: 130px; background: url(images/quote2.png) center no-repeat;}
#footer{ margin-left: 20px;}

#masthead h1 a { display: block; background: url(images/logo.png); width: 230px; height: 169px; text-indent: -9999px; margin-top: 90px;  }

#content.page #featured { margin: 30px 0 0 0;}
#featured .feature { float: left; width: 330px; margin-top: 10px;}
#featured .upcoming { margin-left: 40px;}
#featured .feature a.learnmore { display: block; background: url(images/learnmore.png) center no-repeat; width: 92px; height: 29px; text-indent: -9999px; float: right;}

#content { margin-left: 20px; margin-top: 30px;}

#program_list  { margin-top: 30px; }
#program_list .programs { width: 320px; float: left; }
#program_list .programs ul { list-style-type: none; margin-top: 5px;}
#program_list .programs a { color: #408040; }

.feature .post { clear: both;}
.feature .post img { float: left; margin: 15px 10px 5px 0;}
.feature .post h3 a { font-size: 16px; color: #8c1e14; text-transform: uppercase; }

#featured .feature .post .meta span { color: #bdb585; font-family: Helvetica, Arial, verdana, sans-serif; display: block; font-size: 12px;}
#featured .meta { margin-top: 10px; line-height: 14px; }

#footer img { padding-left: 20px; margin-top: 30px;}

.alignleft { float: left; margin-right: 10px; }
.alignright { float: right; margin-left: 10px; }
.aligncenter { display: block; margin: 0 auto;}

/*-------------------------------------------    

    Typography

-------------------------------------------*/

body { font-family: Helvetica, Arial, verdana, sans-serif; color: #222; font-size: 14px; color: #402a22; line-height: 20px;}
#content h2 { color: #cc6600; font-family: Georgia, Times, serif; font-size: 20px;  text-transform: uppercase; padding-bottom: 5px; }
#featured span { font-family: Georgia, Times, serif; color: #f47920; font-size: 14px;}
#content.page .phplist label { font-family: Helvetica, Arial, verdana, sans-serif;}


#content.page #featured h3, #content #program_list .programs h3 { color: #002561; font-size: 12px; text-transform: uppercase; border: 0; font-weight: normal; }
#content.page #featured h4 { color: #f47920; font-size: 24px; margin-top: 4px; margin-bottom: 15px;}
#content h3 { color: #002561; text-transform: uppercase; font-size: 14px; border-bottom: 1px dotted #CCC; font-weight: bold; font-family: Georgia, Times, serif;}
#content.page h4 { color: #7E0001; font-size: 14px; font-family: Georgia, Times, serif; margin-bottom: -15px; margin-top: 20px;}
#content.page a, #content.post a { color: #266426; font-weight: bold; }
#content.page a:hover, #content.post a:hover { color: #518F50; }

#content.page .phplist label { padding-top: 5px;}
#content.page .phplist .required { font-weight: normal; color: #7E0001;}
#content.page .phplist input#contactsubmit { margin-left: 175px; float: left; margin-top: -20px; }

h3.license { clear: both; margin-top: 20px;}
#content a img { border: 0;}



/* #content.page .page p:first-child { font-size: 18px; line-height: 24px;} */

#nav ul li a:hover { color: #CC6600; }

#copyright { border-top: 1px dotted #720000;}
#footer p { font-size: 10px; float: left; margin-top: 0;}

.wp-caption-text { font-size: 11px; line-height: 12px; margin-top: 0; color: #6F6561;}
.listing { list-style-type: none; margin: 10px 0;}


/*-------------------------------------------    

    Search

-------------------------------------------*/

#search { margin-top: 5px; }
#search #s { border: 1px solid #266826; border-right: none; margin-right: -4px; }
#search #searchsubmit { background: url(images/search.jpg) center no-repeat; border: 1px solid #266826; text-indent: -9999px; border-left: none; width: 25px;}



/*-------------------------------------------    

    Image Gallery

-------------------------------------------*/

#s3slider {
   width: 720px; /* important to be same as image width */
   height: 482px; /* important to be same as image height */
   position: relative; /* important */
   overflow: hidden; /* important */
}

#s3sliderContent {
   width: 720px; /* important to be same as image width or wider */
   position: absolute; /* important */
   top: 0; /* important */
   margin-left: 0; /* important */
}

.s3sliderImage {
   float: left; /* important */
   position: relative; /* important */
   display: none; /* important */
}

.s3sliderImage span {
   position: absolute; /* important */
   left: 0;
   font: 10px/15px Arial, Helvetica, sans-serif;
   padding: 10px 13px;
   width: 374px;
   background-color: #000;
   filter: alpha(opacity=0); /* here you can set the opacity of box with text */
   -moz-opacity: 0; /* here you can set the opacity of box with text */
   -khtml-opacity: 0; /* here you can set the opacity of box with text */
   opacity: 0; /* here you can set the opacity of box with text */
   color: #fff;
   display: none; /* important */
   bottom: 0;

   /*
       if you put
       top: 0; -> the box with text will be shown at the top of the image
       if you put
       bottom: 0; -> the box with text will be shown at the bottom of the image
   */
}

.clear {
   clear: both;
}