@charset "utf-8";
@import url(reset.css);

/* COPYRRIGHT ****************************************************************************************************************************
  Nicolás Pablo Calabrese. Buenos Aires, Argentina | URL: www.sikker.com.ar | e-mail: sikker@gmail.com
  ****************************************************************************************************************************************
/* DEFAULT COLORS ************************************************************************************************************************
  background: #1C1E23 | text: #585A62  | dark text: #484C54  |  em text: #91939A  |  cyan: #14ABBA  |  magenta:#EE0B60  |  lines: #33363C
******************************************************************************************************************************************/

body                                   {border-top:4px solid #EE0B60;background:#1C1E23;text-align:center; font:11px Tahoma, Arial, Verdana, sans-sertif;}
#wrapper                               {width:912px;text-align:left;margin:0 auto;padding:47px 20px;}
acronym                                {text-decoration:underline; cursor:help; }
acronym:hover                          {text-decoration:underline; color:#91939A;}

noscript em                            {background:#FFF6D2; color:#000; padding:3px}
noscript em:before                     {content:"! "; color:red; font-weight:bold;}
noscript a                             {color:#000;}

 /**
 *  Header
 **/

#header                                {height:100px;}   
   #header h1                          {width:182px;height:65px;position:absolute;left:50%;margin:0 0 0 -91px;}
   #header ul                          {float:left;margin:10px 0 0 0;text-align:right;font-size:9px;}
   #header ul li a                     {color:#484C54;padding-right:13px;background:url(../img/lang-selector.gif) no-repeat right -22px;}
   #header ul li a.active,
   #header ul li a.active:hover        {color:#91939A;background:url(../img/lang-selector.gif) no-repeat right 2px;}
   #header ul li a:hover               {color:#91939A;text-decoration:none;background:url(../img/lang-selector.gif) no-repeat right -10px;}


 /**
 *  Nav
 **/

#nav                                   {border-bottom:1px solid #33363C;height:21px;font-size:11px}
   #nav h2                             {font-weight:normal;float:left;}
   #nav h2                             {padding:4px 0 0 0;}
   #nav ul                             {float:right;}
      #nav ul li                       {display:inline;}
      #nav a                           {display:block;width:76px;height:21px;float:left;line-height:21px;text-indent:10px;
                                       background:url(../img/tab.gif) no-repeat;position:relative;bottom:-1px;}
      #nav a:hover                     {color:#91939A;text-decoration:none;}
      #nav a.active                    {color:#91939A;background-position:0 -42px;}
      #nav a.active:hover              {text-decoration:none;background-position:0 -42px;}


 /**
 *  Contents
 **/

#content                               {margin:27px 0;width:918px;position:relative;top:-4px;left:-4px;}
   #thumbnails                         {overflow:hidden;padding:4px;margin-bottom:24px;}
      #works                           {background:url(../img/bg-thumbnails.gif);float:left}

      html>body #works:hover           {background:url(../img/black-70.png);} /* The hover effect is disabled for old browsers using: html>body */
      html>body #works:hover img       {position:relative;z-index:-1}
      html>body #works a:hover         {position:relative;z-index:10;margin:0 -8px -8px 0} 
      html>body #works:hover a:hover   {border:4px solid #14abba;position:relative;top:-4px;left:-4px;}
      html>body #works:hover a         {background:url(../img/image-loader.gif) no-repeat -500px -500px;}
      #works a                         {display:block;width:130px;height:87px;float:left;color:#27292e;
                                       background:url(../img/image-loader.gif) no-repeat center center;}
      html>body #works 
      a.visited:hover                  {border:4px solid #ED0A5F;}
         
      #mailworks,#mediaworks           {display:none;} 

#ncdata                                {overflow:hidden;padding:0 4px;}
   #ncdata:hover dd,#ncdata:hover p    {color:#606368 }
   #ncdata:hover #profile dt           {color:#636468 }
	
   #profile                            {float:left;width:688px;overflow:hidden;}
   #ncbio div                          {display:block;width:229px;float:left;}
   #ncbio,#moreinfo                    {margin-top:20px}
   #ncbio                              {background:url(../img/bg-profile.gif) no-repeat 37px 0;
                                       overflow:hidden} /* Prevnt IE Mac display problem */

      #profile h2.spanish              {text-indent:-20000px;background:#1C1E23 url(../img/h2a_es.gif) no-repeat;width:195px;height:22px;}	
      #profile h2.english              {text-indent:-20000px;background:#1C1E23 url(../img/h2a_en.gif) no-repeat;width:209px;height:22px;}	
      #profile h2.spanish span         {display:block;position:relative;left:195px;width:480px;height:15px;border-bottom:1px solid #33363C;}	
      #profile h2.english span         {display:block;position:relative;left:213px;width:462px;height:15px;border-bottom:1px solid #33363C;}	

      #profile img                     {width:63px;height:63px;float:left;margin:0 10px 0 0;}
      #profile h3                      {margin:8px 0 0 0;color:#14ABBA;font-weight:bold;}
      #profile h3 a                    {color:#14ABBA;}
      #profile dt                      {float:left;margin-right:3px;}
      #profile dd + dt                 {display:none;}
      * html #profile dt               {display:none;} /* Hides DT tags in IE6 */
      #profile dl                      {margin:5px 0 23px 0;}
      #profile p                       {margin:0 0 10px 0;width:215px;}
      #profile p:hover em              {color:#14ABBA;}
      #profile p:hover a               {color:#14ABBA;}
      #profile p:hover acronym         {color:#818286;}
      
      #profile p:hover, 
      #skills:hover dd                 {color:#606368;}

	
      #profile em,#profile a           {color:#91939A;font-style:normal;}
      
   #skills                             {float:left;}
      #skills h2.spanish               {text-indent:-20000px;background:#1C1E23 url(../img/h2b_es.gif) no-repeat;width:131px;height:22px;}
      #skills h2.english               {text-indent:-20000px;background:#1C1E23 url(../img/h2b_en.gif) no-repeat;width:69px;height:22px;}
      #skills h2.spanish span          {position:relative;left:131px;width:91px;height:15px;border-bottom:1px solid #33363C;display:block}	
      #skills h2.english span          {position:relative;left:73px;width:156px;height:15px;border-bottom:1px solid #33363C;display:block}	
      #skills dl                       {width:215px;}
      #skills dt                       {color:#91939A; font-weight:bold;}
      #skills dt+dd                    {margin:0 0 10px 0;}


 /**
 *  Footer
 **/
 
#footer                                {border-top:1px solid #33363C;padding:10px 0 0 0;font-size:9px;height:30px;clear:both;
                                       position:relative;} /* Solves the footer link problem in Firefox */
* html #footer                         {margin-top:-50px;} /* Moves the footer up in IE6 */
   #footer img                         {float:left}
   #footer div#author                  {float:left;margin:0 0 0 16px; background:url(../img/vertical-line.gif) repeat-y;}
  
   #footer div#author span             {display:block;color:#484C54; text-indent:17px;}
   #footer div#author span a:hover     {color:#91939A;}  
   #footer div#hosting                 {float:right; /* margin:0 -16px 0 0; */}
   #footer div#hosting	p              {color:#484C54;}
   #footer div#hosting	a img          {background:url(../img/vertical-line.gif) repeat-y;padding:0 16px;}