/*  
Theme Name: Moroccoblu
Author: blwwweb
Description: Tema de moroccoblu desarrollado y adaptado para wordpress por blu para monkey-solutions.com.
Author URI: http://www.monkey-solutions.com
*/

/* 
Morocco New Color Pallete

Red #330000
Red #660000
Gray #333333
Blue #0000CC
DarkBlue #000033

Fonts
Trebuchet MS (h2, menu)
Georgia Bold (h1)
Helvetica ( Content )
 */

/* ---------------Reset--------------- */

*					{margin: 0; padding: 0; }
html				{overflow-y: scroll; }
html, body			{height: 100%; }
body				{font-size: 62.5%; font-family: Helvetica, sans-serif; color: #000033;
					background: white url(/images/moroccohead.jpg) top center no-repeat ;}
ul					{list-style: none;}
ol					{list-style: decimal inside;}
a					{outline: none; text-decoration: none; color: #666666;}
a img				{border: none;}
img					{vertical-align: middle; -moz-border-radius: 5px; -webkit-border-radius: 5px;}
table				{border-collapse: collapse;}

*:link, *:visited, *:hover, *:active, *:focus {
   -webkit-transition:
     color .25s linear,
      background-color .25s linear,
     border-color .25s linear;
   transition:
     color .25s linear,
     background-color .25s linear,
     border-color .25s linear;
}

 img, div, input { behavior: url("iepngfix.htc") }

/* ---------------UTILITY--------------- */
 					
.floatLeft			{float: left;}
.floatRight			{float: right;}
.clear				{clear: both; }
/*
.button				{border: 1px solid #FFFFFF; background: #660000;
					padding: 3px 8px; 
					-moz-border-radius: 5px; -webkit-border-radius: 5px;
					color: #FFFFFF; }
.button:hover		{background: #FFFFFF; color: #660000;  }
*/

.button			{
	display: inline-block;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	
	padding: .5em 2em .55em;
	text-shadow: 0 1px 1px rgba(0,0,0,.3);
	-webkit-border-radius: .5em;
	-moz-border-radius: .5em;
	border-radius: .5em;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
.button:hover {
	text-decoration: none;
}
.button:active {
	position: relative;
	top: 1px;
}
.redBtn {
	color: #fef4e9;
	border: solid 1px #3e0101;
	background: #660000;
	background: -webkit-gradient(linear, left top, left bottom, from(#660000), to(#830101));
	background: -moz-linear-gradient(top,  #660000,  #830101);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#660000', endColorstr='#830101');
}
.redBtn:hover {
	background: #830101;
	background: -webkit-gradient(linear, left top, left bottom, from(#830101), to(#d40202));
	background: -moz-linear-gradient(top,  #830101,  #d40202);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#830101', endColorstr='#d40202');
}
.redBtn:active {
	color: #530101;
	background: -webkit-gradient(linear, left top, left bottom, from(#830101), to(#660000));
	background: -moz-linear-gradient(top,  #830101,  #660000);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#830101', endColorstr='#660000');
}


/* ---------------TYPGROGRAPHY--------------- */
p, li								{ font-size: 1.3em; line-height: 1.2em; margin: 0 0 10px 0; }
p#intro-paragraph					{ font-family:"Trebuchet MS"; font-size: 2.0em; font-style: italic; line-height: 1.4em; 
									  margin-top: 5px; }
p#intro-paragraph span				{ font-size: 2.4em; font-weight: bold; }
p#intro-paragraph em				{ color: #660000; }
a									{ color: #660000;}
a:hover								{ background: #660000; color: white; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
h1									{ font-size: 3.6em; font-family:"Trebuchet MS"; font-weight: normal; text-shadow: 0px -1px 3px #555; margin-bottom: 15px;  }
h2
									{ font-size: 2.8em; font-family: Georgia, serif; font-weight: normal; text-shadow: #000000 1px 1px 1px;; margin-bottom: 15px;}
h3									{ color: #666666;font-size: 2.4em; font-family:"Trebuchet MS"; font-weight: normal; margin: 0 0 10px 0; }
h3 a:hover							{background: #660000; color: white; -moz-border-radius: 5px; -webkit-border-radius: 5px;}
.post h3							{color: #000033; font-size: 2.4em; font-family: Georgia, serif; font-weight: normal; margin: 0 0 10px 0; text-shadow: #666666; }
h4									{ color: #000033; font-size: 1.8em; margin-bottom: 15px; text-shadow: #000000; text-align: center; }
.post h4							{ font-size: 1.8em; font-family: Georgia, serif; font-weight: normal; margin: 0 0 10px 0;
									  color: #660000; text-shadow: #666666; }
h4 a:hover							{background: #660000; color: white; -moz-border-radius: 5px; -webkit-border-radius: 5px;}
a:hover	h4 							{background: #660000; color: white; -moz-border-radius: 5px; -webkit-border-radius: 5px;}
h5					{ color: #000033; font-size: 1.6em; margin-bottom: 15px;
					text-shadow: #660000 0px -1px 1px; font-family:"Trebuchet MS";}
.post h5			{ color: #660000; font-size: 1.6em; margin-bottom: 15px;
					text-shadow: #000033 0px -1px 1px; font-family:"Trebuchet MS";}
a:hover h5 			{background: #660000; color: white; -moz-border-radius: 5px; -webkit-border-radius: 5px; width: 90px; }
h6					{ color: #000033; font-size: 1.4em; margin: 0 10px 10px 0;
					text-shadow: #000033 2px 2px 2px;}
.shadow					{ color: #666666; font-size: 1.7em; font-style: bold; margin: 0 10px 10px 0;
					text-shadow: #CCC 2px 2px 2px;}
h8					{ color: #000033; font-size: 1.2em; font-style: bold; margin: 10px 10px 20px 0;
					text-shadow: #666666 2px 2px 2px;}
p.darker			{color: #660000; }
.more-link			{font-size: 1.8em; font-family: Georgia, serif; font-weight: normal; margin: 10px 0px;
					color: #660000; text-shadow: #666666; float:right;}
.biggerbolder		{font-size: 1.2em; font-family: Georgia, serif; font-weight: bold; margin:10px;}
.firstletter		{font-size: 2.2em; font-family: Georgia, serif; font-weight: bold; }
.dsq-comment-message	{font-size: .8em;}

/* ---------------Structure--------------- */

#wrapper			{ width: 960px; margin: 0px auto -250px;
					min-height: 100%; height: auto !important; height: 100%; }
#push				{ height: 450px; }

#leftsidebar		{ width: 170px; float: left; margin-right: 80px; margin-bottom: 15px}
#main-col			{ width: 588px; float: left; background: transparent url() top left repeat-x ; }
#linksidebar		{ width: 200px; float: right; margin-right:10px;  background: transparent url() top left repeat-y; }

/* ----------- Header----------- */


h1#logo				{ width: 158px; height: 101px;background: url() top left no-repeat; 
text-indent: -9999px; margin: 0 10px 8px 0;float: left;  }
#top-bar			{padding: 0 0 0 5px; }
#top-bar p			{padding: 20px 0 0 0; color: #666666; width: 300px; float: left; }
form#searchform		{ margin: 20px 5px 10px 0; float: right;}
#playertop			{float: right; margin: 0px;}		


/* ---------------MENU* --------------- */
#menu-bar							{ padding-top: 11px; padding-bottom: 25px;}
ul#main-nav							{ width: 920px; float: left; margin: 110px 0 22px 270px; }
ul#main-nav	li						{ display: inline; }
ul#main-nav li a					{ color: #000033; font-family:"Trebuchet MS"; font-size: 1.2em; padding: 5px 5px;
									  -moz-border-radius: 5px; -webkit-border-radius: 5px; }
ul#main-nav li a:hover,
ul#extra-nav li a:hover,
body#portfolio ul#main-nav li.moroccohome a,
body#default ul#main-nav li.moroccopics a,
body#about ul#main-nav li.moroccotalk a,
body#contact ul#main-nav li.moroccomedia a,
body#resume ul#main-nav li.moroccolinks a{ background: transparent; color: #999999; }


/* ---------------WIDGETS--------------- */
.widget								{ background: transparent; width: 180px; border-bottom: 1.5px solid #000033; 
-moz-border-radius: 5px; -webkit-border-radius: 5px; margin: 0px 20px 15px 0px;  }
.widget .inside						{ padding: 10px; }
.widget a							{color:#660000;}
.widget ul							{ list-style: none; margin-left: 15px; }
.widget ul li 						{ margin: 0px;  }
.widget ul li a 					{ display: block; padding: 2px; color: #660000; font-size: 1em; }
.widget ul li a:hover				{ background: white; color: #000033; }
.thumb								{ width: 70px; float: left; }
.flickr-thumb						{ height: 50px; width: 50px; overflow: hidden; float: left; margin: 0 0 5px 15px; border: 1px solid #660000; -moz-border-radius: 5px; -webkit-border-radius: 5px;}
#lightbox-nav-btnNext a:hover		{background: transparent url(http://www.moroccoblu.com/images/lightbox-btn-next.gif) top left no-repeat;}
#lightbox-nav-btnPrev a:hover		{background: transparent url(http://www.moroccoblu.com/images/lightbox-btn-prev.gif) top left no-repeat;}
.tweet								{margin:10px 0px; border-bottom: 1px dashed #660000;}

#tweet p a:hover 					{ color: white;  -moz-border-radius: 5px; -webkit-border-radius: 5px;  }

.widgetTop							{height: 210px;}
.widget ul li.lastFM				{margin-bottom: 5px;  border-bottom: 1px dashed #660000;}
.tuit					{height: 427px; width: 180px; background: transparent url(http://www.moroccoblu.com/images/BluTwitter.jpg) top left no-repeat;}
p.silo					{  font-size: 1.4em; font-style: italic; color: #000033; word-wrap:break-word;}
.silo					{ width: 160px; padding: 5px 5px 5px 5px; }
/* ---------------LINKS--------------- */

a.linkimg 					{display:block; float: left; margin: 5px 0 0 20px; opacity: 0.6; color: black;}
a.linkimgR 					{display:block; float: right; margin: 5px 0 0 20px; opacity: 0.6; color: black;}
a:hover.linkimg, a:hover.linkimgR    				{opacity: 1.0; border:none; color:white; }

/* ---------------BLOG ENTRIES--------------- */
	
.post								{ margin: 0 0 25px 10px; padding-bottom: 10px; 	}
.datebox							{ width: 50px; float: left; padding: 0 5px 5px 5px; background: #330000; color: white; text-align: center;
									  margin: 0 10px 0 0; }
.day								{ font-size: 3.4em; font-weight: bold; margin: 0; font-family: Georgia, serif; }
.month								{ font-size: 1.8em; font-weight: bold; text-transform: uppercase; margin: 0; }
.year								{ font-size: 1.6em; font-weight: bold; margin: 0; }

div.post img.postimg	{float:left; border: 1px solid #660000; margin:0px 5px 5px 0px ; width:100px; height:100px; overflow: hidden; border: 1px solid white; -moz-border-radius: 8px; -webkit-border-radius: 8px; }

/* ---------------COMMENTS--------------- */

ol.commentlist						{ list-style: none; }
#comment-bubble						{ background: #660000; color: white; padding: 10px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.bubble-tip {margin-top: -10px;	}								 
ol.commentlist li p					{ font-size: 1.0em; }
.gravatar							{ margin-top: 3px; padding: 2px; height: 40px; }
.comment							{ margin-top: 10px; font-size: 1.4em; font-weight: bold;}

.author-comment						{ background: #000033; color: white; padding: 10px; 
									-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
ol.commentlist li.author-comment p		{font-size: 1.1em; color: white;}
li.author-comment img.gravatar		 {border:5px solid #474747;} 
li.author-comment img.bubble-tip		{display:none;}

.admin-comment						{ background: #999;  padding: 10px; 
									-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;  }
									
ol.commentlist li.admin-comment p		{font-size: 1.1em; color: white;}
li.admin-comment img.gravatar		 {border:5px solid #474747;} 
li.admin-comment img.bubble-tip		{display:none;}
#comment-bubble.admin-color			{background: #999;}
#comment-bubble.author-color		{background: #999;}

#sharePost		{background-color: #000033; color: white; display: block;  }
#disqus_thread {-moz-border-radius: 5px; -webkit-border-radius:5px; -moz-box-shadow: inset 0px 2px 4px rgba( 0,0,0,0.4); -webkit-box-shadow: inset 0px 2px 4px rgba( 0,0,0,0.4); padding:10px;}
 

/* ---------------Posts----------------*/
div.post img.alignleft {float:left;padding: 0 5px 5px 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;}
div.post img.alignright {float:right;padding: 0 5px 5px 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;}

.previousLink						{font-size: .9em; float: left; margin-top: 20px;}
.nextLink							{font-size: .9em; float: right;margin-top: 20px;}

.navigation							{margin: 20px 0; padding: 5px 0px; border-top: 1px solid #660000; }
img.postpic							{border: 5px solid white; display: block; margin-left: auto; margin-right: auto;}



/* ---------------FOOTER----------------*/

#footer								{ height: 250px; background: #ccc url(/images/MB-tile.jpg) top left repeat; border-top: 5px solid #333;  }
#footer h5							{padding: 5px;}
#footer-inside						{ width: 960px; margin: 0 auto;}
#footer p							{ color: #000033;}
#footer-copy						{width: 300px; float: left; margin-right: 30px; }
#footer-rss							{width: 200px; float: left; margin:0 30px 0 20px; background: #808080; border: 3px solid #333; }
#footer-menu						{width: 200px; float: left; background: #808080; border: 3px solid #333;}
#footer a						{padding: 5px 0px 0px 5px; font-size: 1.2em; color:white;}
#footer-latest						{width: 200px; float: left; margin-left:30px; background: #808080; border: 3px solid #333;}
#footer-monkey .insidei	{font-size: 6pt; color: #000033; margin-right: 5px; margin-top: 18px; float: right;}
#footer-monkey .insideo	{font-size: 6pt; color: #ff5a19;float: right; }
#footer-monkey .insideo a {color: #ff5a19;}
#footer-monkey img					{border: none;}
#footer-monkey						{margin-right: 20px;}

#footer-post						{ overflow: hidden; text-align: center; margin: 10px 0px 20px 0px; }
#footer-post a						{ display: block; float: left; width: 32px; height: 32px; opacity: 0.6; text-indent: -9999px;
									  margin: 0 9px 0 0; }
#footer-post a img					{ width: 32px; height: 32px;}									  
#footer-post a:hover				{ opacity: 1.0; border: none; }
#footer-post a.delicious			{ background: url(/images/social/delicious-icon.png) top left no-repeat; }
#footer-post a.digg					{ background: url(/images/social/digg-icon.png) top left no-repeat; }
#footer-post a.twitter				{ background: url(/images/social/twitter-icon.png) top left no-repeat; }
#footer-post a.email				{ background: url(/images/social/rss-icon.png) top left no-repeat; }
#footer-post a.foot_facebook		{ background: url(/images/social/facebook-icon.png) top left no-repeat; }


/* ---------------SOCIAL NAV----------------*/

#social-bar
{
float:left;
margin-left: -10px;

}

#socialNav				{ width: 180px; float: left; }
#socialNav a			{ display: block; float: left; width: 64px; height: 64px; opacity: 1.0; text-indent: -9999px;
						margin: 0 5px 5px 0 ; }
#socialNav a:hover		{ opacity: 0.7; border: none; }


#socialNav a#facebook			
{ width: 64px; height: 64px; background:transparent url(/images/socialicons/fb.png) top left no-repeat; float: left;
}


#socialNav li a#myspace	
{ width: 64px; height: 64px; background:transparent url(/images/socialicons/ms.png) top left no-repeat; float: left;
}

#socialNav a#hi5			
{ width: 64px; height: 64px; background:transparent url(/images/socialicons/hi5.png) top left no-repeat; float: left;
}

#socialNav a#twitteric			
{ width: 64px; height: 64px; background:transparent url(/images/socialicons/tw.png) top left no-repeat; float: left;
}


#socialNav li .footer-post
{margin-right: 10px;}

/**
 * jQuery lightBox plugin
 * This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
 * and adapted to me for use like a plugin from jQuery.
 * @name jquery-lightbox-0.5.css
 * @author Leandro Vieira Pinho - http://leandrovieira.com
 * @version 0.5
 * @date April 11, 2008
 * @category jQuery plugin
 * @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
 * @license CC Attribution-No Derivative Works 2.5 Brazil - http://creativecommons.org/licenses/by-nd/2.5/br/deed.en_US
 * @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
 */
 
#jquery-overlay {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
}
#jquery-lightbox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}
#lightbox-nav {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
	width: 49%;
	height: 100%;
	zoom: 1;
	display: block;
}
#lightbox-nav-btnPrev { 
	left: 0; 
	float: left;
}
#lightbox-nav-btnNext { 
	right: 0; 
	float: right;
}
#lightbox-container-image-data-box {
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%;
	padding: 0 10px 0;
}
#lightbox-container-image-data {
	padding: 0 10px; 
	color: #666; 
}
#lightbox-container-image-data #lightbox-image-details { 
	width: 70%; 
	float: left; 
	text-align: left; 
}	
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber {
	display: block; 
	clear: left; 
	padding-bottom: 1.0em;	
}			
#lightbox-secNav-btnClose {
	width: 66px; 
	float: right;
	padding-bottom: 0.7em;	
}