/*
Theme Name: r u b y pajares
Author: Ruby Pajares
Theme URL: http://rubypajares.com
Version: 2.0
Site: ©2010 r u b y pajares
*/

* {margin:0; padding:0;}

body {background: #fff;	font-family: "Lucida Grande", Tahoma, "Trebuchet MS"; font-size: 60%; color: #272727;}

p {color: #000; font-family: "Lucida Grande", Tahoma, "Trebuchet MS"; font-size: 1.1em;}

a {text-decoration: none; color: #000;}

a:hover {text-decoration: none; color: #999;}

img {border: none;}

/* ------------ topbar begins -------------- */
.topbar {background-color: #000; height: 34px; width: 100%;}

#header {width: 940px; height: 50px; margin: 0px auto;}

#header h1 a {background:url(images/logo.png) no-repeat; width:200px; height:30px; float: left;	margin-top: 5px;}

#header h1 a span {display:none;}

.nav {width: 740px;	float: left; text-align: left; font-size: 1.2em; text-transform: normal; padding-top: 1px;}

.nav ul{margin: 0px;}

.nav li {display: inline; float: right; list-style: none; margin-top: 2px;}

.nav .main {width: 600px; float: right; margin-left: 95px; margin-right: 0px;}

.nav .main a.button {background-color: #000; padding: 8px 10px 8px 10px; color: #fff; text-decoration: none; font-size: 1.1em; line-height: 28px;}

.nav .main a.button:hover {background-color:#333; text-decoration:none;}

/* ------------
.nav .downloads {width: 195px; float: left; margin-left: 50px;}

.nav .downloads a.button {background-color: #000; padding: 10px 30px 10px 10px; color: #fff; font-size: 0.8em; text-decoration: none; line-height: 28px; background: transparent url(images/download.png) no-repeat 90% 50%;}

.nav .downloads a.button:hover {background-color: #333; text-decoration: none;}

.nav .subscribe {width: 100px; float: left;}

.nav .subscribe a.button {background-color: #000; padding: 10px 30px 10px 10px; color: #fff; font-size: 0.8em; text-decoration: none; line-height: 28px; background: transparent url(images/rss.png) no-repeat 90% 50%;}

.nav .subscribe a.button:hover {background-color: #333; text-decoration: none;}
-------------- */

/* ------------ content -------------- */
.content { margin: 25px auto; width: 940px;} 

.content h2 { width: 940px; color: #ccc; float: left; margin: 13px 5px 5px 0; border-bottom: 1px #ccc solid;}


/* ------------ little rubies -------------- */
#littleruby {width:200px; padding: 0px 100px; text-align: center; margin: 10px auto; clear: both; }


/* ------------ INDEX > slider -------------- */
#slidesContainer {clear: both; margin: auto; overflow: auto; margin: 10px 0px 0px 0px; border: 1px #ccc solid; height: 400px; }

#slideshow {margin-top: 25px;}

#slideshow h2 { width: 940px; color: #ccc; float: left; margin: 13px 5px 5px 0; border-bottom: 1px #ccc solid;}

.slide {text-align:left;}

.instruction {width: 940px; float: left; line-height: 1.5em; margin: 13px 5px 5px 0; }

.instruction .title { color: #9e9e9e; float: left; font-size: 1.5em; margin-right: 10px;}

.instruction .text { color: #ccc; float: left; font-size: 1.1em;}

#controls {float:right; }

#controls p {display:inline;}

.control, #endControl {color:#000000; cursor: pointer; display:block; font-weight:bold; padding:4px 8px;}

#leftControl, #rightControl, #endControl {background:#000000 none repeat scroll 0 0; float:right; margin-left:5px;}

#leftControl:hover, #rightControl:hover, #endControl:hover {background:#666 none repeat scroll 0 0; }

#leftControl a, #rightControl a, #endControl a {color:#FFFFFF; }

.slide img {margin-bottom:0px;}


/* ------------ DESIGN -------------- */
.spacer {height: 20px;}

.designPiece { width: 940px; padding-top: 40px; padding-bottom: 20px; float: left; }

.details { float: left; width: 300px; padding-right: 25px; }

.details h2 {float: left; width: 300px; color: #000; border: none; margin-top: 0px;}

.blurb {margin: 30px 0px 10px 0px;}

.facts {margin: 10px 0;}

.facts a { color: #ccc;}
.facts a:hover { text-decoration: underline;}


/* ------------ DESIGN >> Gallery-Horizontal -------------- */
.main_image, .main_image2, .main_image3, .main_image7, .main_image9, .main_image10, .main_image12, .main_image13, .main_image14
{ width: 550px; float: right; position: relative; overflow: hidden; color: #fff; border: 1px solid #ccc; margin-left: 10px; }

.image_thumb, .image_thumb2, .image_thumb3, .image_thumb7, .image_thumb9, .image_thumb10, .image_thumb12, .image_thumb13, .image_thumb14
{ float: left; background: #f0f0f0; border-top: 1px #ccc solid; border-left: 1px #ccc solid; margin-top: 30px; margin-top: 30px;}
	
.image_thumb img, .image_thumb2 img, .image_thumb3 img, .image_thumb7 img, .image_thumb9 img, .image_thumb10 img, .image_thumb12 img, .image_thumb13 img, .image_thumb14 img
{ width: 50px; background: #fff; float: left; border-bottom: 1px solid #ccc; border-right: 1px #ccc solid; }

.image_thumb ul, .image_thumb2 ul, .image_thumb3 ul, .image_thumb7 ul, .image_thumb9 ul, .image_thumb10 ul, .image_thumb12 ul, .image_thumb13 ul, .image_thumb14 ul
{ margin: 0; padding: 0; list-style: none; }

.image_thumb ul li, .image_thumb2 ul li, .image_thumb3 ul li, .image_thumb7 ul li, .image_thumb9 ul li, .image_thumb10 ul li, .image_thumb12 ul li, .image_thumb13 ul li, .image_thumb14 ul li
{ display:inline; float: left; margin: 0; }

.image_thumb ul li.hover, .image_thumb2 ul li.hover, .image_thumb3 ul li.hover, .image_thumb7 ul li.hover, .image_thumb9 ul li.hover, .image_thumb10 ul li.hover, .image_thumb12 ul li.hover, .image_thumb13 ul li.hover, .image_thumb14 ul li.hover
{ background: #ddd; cursor: pointer; }

.image_thumb ul li.active, .image_thumb2 ul li.active, .image_thumb3 ul li.active, .image_thumb7 ul li.active, .image_thumb9 ul li.active, .image_thumb10 ul li.active, .image_thumb12 ul li.active, .image_thumb13 ul li.active, .image_thumb14 ul li.active
{background: #fff; cursor: default; opacity: filter:alpha(opacity=80); opacity: 0.8;}


/* ------------ DESIGN >> Gallery-Vertical -------------- */
.main_image4, .main_image5, .main_image6, .main_image8, .main_image11
{ width: 350px; height: 485px; float: left; position: relative; overflow: hidden; color: #fff; border: 1px solid #ccc; margin-left: 62px; }

.image_thumb4, .image_thumb5, .image_thumb6, .image_thumb8, .image_thumb11
{ float: left; background: #f0f0f0; border-top: 1px #ccc solid; border-left: 1px #ccc solid; margin-top: 30px; }
	
.image_thumb4 img, .image_thumb5 img, .image_thumb6 img, .image_thumb8 img, .image_thumb11 img
{ height: 50px; background: #fff; float: left; border-bottom: 1px solid #ccc; border-right: 1px #ccc solid; }

.image_thumb4 ul, .image_thumb5 ul, .image_thumb6 ul, .image_thumb8 ul, .image_thumb11 ul
{ margin: 0; padding: 0; list-style: none;}

.image_thumb4 ul li, .image_thumb5 ul li, .image_thumb6 ul li, .image_thumb8 ul li, .image_thumb11 ul li
{ display:inline; float: left; margin: 0;}

.image_thumb4 ul li.hover, .image_thumb5 ul li.hover, .image_thumb6 ul li.hover, .image_thumb8 ul li.hover, .image_thumb11 ul li.hover
{ background: #ddd; cursor: pointer; }

.image_thumb4 ul li.active, .image_thumb5 ul li.active, .image_thumb6 ul li.active, .image_thumb8 ul li.active, .image_thumb11 ul li.active
{background: #fff; cursor: default; opacity: filter:alpha(opacity=80); opacity: 0.8;}




/* ------------ CONTACT -------------- */
.contactinfo { width: 940px; float: left; color: #fff; padding-top: 40px; }

.contactinfo strong {  }

.contactinfo ul { margin: 10px auto;}

.contactinfo ul li {display:inline;}

.hbreak {margin: auto 10px;}

.vbreak {margin: 30px auto;}


/* ------------ footer begins -------------- */
#footer {width: 940px; font-size: 0.9em; color: #ccc; margin: auto;}

#footer a {text-decoration: none; color: #ccc;}

#footer a:hover {text-decoration: underline; color: #9e9e9e;}

#footer .nav {text-transform: normal; padding-top: 10px; float: left; text-align: left; width: 820px;}

#footer .nav ul{margin: 0px; display: inline;}

#footer .nav li {float: left; list-style: none;}

#footer .copyright {float: left; text-align: left; width: 100px; padding-top: 15px;}