/*	-------------------------------------------------------------
	UX Magazine
	Design | Technology | Strategy | Common Sense
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
	Description:	Base setup styles
	Filename:		uxm.base.css
	Version:		1.8
	Date:			Feb 9, 2006
	-------------------------------------------------------------	*/


/*	-------------------------------------------------------------
	Base Body Styles
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
		
		body {
			margin: 0px 0px 15px 0px;
			padding: 0px;
			background-color: #ffffff;
			/*background-image: url(../_images/main_bg.png);*/
			background-repeat: repeat-x;
			background-position: top;
			color: #485056;
			font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; }
			
		a, a:visited {
			color: #003366;
			text-decoration: none;
			background-image: url(../_images/link_dotted.png);
			background-repeat: repeat-x;
			background-position: bottom;}
			
		a:hover {
			background-image: url(../_images/link_solid.png);}
		
		a img {
			border:0px;}
		
		html {
			height: 100%;
			width: 100%;
			margin-bottom: 15px; }
			
		p {
			margin: 6px 0px 8px 0px;
			padding: 0px;}
		
		h1 {
			padding: 0px;
			margin: 0px;}
		
		.words {
			font-size: 11px;
			line-height: 140%;}
		
		#home {
			height: 100%;
			width: 100%;}
		
		
		
/*	-------------------------------------------------------------
	Header
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
	
		#header {
			padding: 0px 5px 0px 5px;
			height: 70px; }
			
/*	Logo
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
	
		#header #logo {
			background-image: url(../../../_images/logoweb.gif);
			width: 250px;
			height: 52px;			
			display: block;
			padding: 0px;
			margin: 10px 0px 0px 0px;
			float: left; }
	
		#header #logo a {
			height: 52px;
			width: 250px;
			display: block;
			border: none;
			background-image: none; }
			
		#header #logowpja {
			background-image: url(../../../_images/wpja_plain_logo_black_red.gif);
			width: 276px;
			height: 60px;			
			display: block;
			padding: 0px;
			margin: 8px 0px 0px 0px;
			float: right; }
	
		#header #logowpja a {
			width: 276px;
			height: 60px;
			display: block;
			border: none;
			background-image: none; }


/*	-------------------------------------------------------------
	Beta Bar
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
			
		#betaNotice {
			background-color: #f5f3de;
			border: solid 1px #dddab5;
			padding: 5px 5px 5px 29px;
			background-image: url(../_images/icon_info.png);
			background-repeat: no-repeat;
			margin: 5px;
			font-size: 11px;
			clear: both; }
			
		#betaNotice2 {
			background-color: #fffff;
			border: 0;
			padding: 5px 5px 5px 29px;
			background-repeat: no-repeat;
			margin: 5px;
			font-size: 11px;
			clear: both; }


/*	#############################################################
	Home Page
	#############################################################
	#############################################################	*/

/*	-------------------------------------------------------------
	Primary Block
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
	includes:	Feature, Article List, Sponsor, Snap Shot,
				Sound Byte, The Number, Site Info
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/

		#primary {
			font-family: Tahoma, Arial, Helvetica, sans-serif;
			background-color: #fff;
			padding: 0px;
			float:left;
			display: inline;
			height: auto;
			width: 750px; }
			
		#primary #entrega{
			font-family: Tahoma, Arial, Helvetica, sans-serif;
			background-color: #fff;
			padding: 0px;
			float:left;
			display: inline;
			height: auto;
			width: 1000px; }
		
/*	Feature Image & Feature Text
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
			
		#primary #featureImage {
			border-width: 5px 0px 0px 5px;
			border-color: #fff;
			border-style: solid;
			float: left;
			width: 495px;
			height: 318px;
			overflow: hidden;
			background-position: top left; }
			
		#primary #featureImage a {
			width: 495px;
			height: 280px;
			display: block;
			border: none;
			background-image: none; }
			
		#primary #feature {
			font-size: 11px;
			border-width: 0px 0px 0px 5px;
			border-color: #fff;
			border-style: solid;
			float: left;
			width: 245px;
			height: 117px;
			overflow: hidden;
			background-position: bottom left; }
			
		#primary #feature a, #primary #feature a:visited {
			border: none;
			background-image: none; }
			
		#primary #feature a:hover {
			border: none; }
			
		#primary #feature .feature {
	display: block;
	margin: 0px;
	width: 217px;
	height: 107px;
	padding-top: 8px;
	padding-right: 10px;
	padding-bottom: 14px;
	padding-left: 10px;
}
			
		#primary #feature .featureLink {
			font-size: 10px;
			text-transform: uppercase;
			padding: 5px 3px 3px 0px;
			display: block;
			margin-top: 8px;
			border-top: solid #ffffff 1px; }
			
/*	Sponsor
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
			
		#primary #adSponsor {
			border-width: 5px 0px 0px 5px;
			border-color: #fff;
			border-style: solid;
			float: left;
			width: 245px;
			height: 163px;
			overflow: hidden; }
			
		#primary #adSponsor a,
		#primary #adSponsor a:hover {
			display: block;
			border: none;
			margin: 0px;
			padding: 0px; }
			
		#primary #adentrega {
			border-width: 5px 0px 0px 5px;
			border-color: #fff;
			border-style: solid;
			float: left;
			width: 490px;
			height: 388px;
			overflow: hidden; }
			
			
		#primary #faq .fotosomos {
			border-width: 5px 7px 20px 5px;
			border-color: #fff;
			border-style: solid;
			float: left;
			width: 310px;
			height: 300px;
			overflow: hidden; }
			
		#primary #faq .fotosomos a,
		#primary #faq .fotosomos a:hover {
			display: block;
			border: none;
			margin: 0px;
			padding: 0px; }
			
/*	Merge Box
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/

		#merge {
			width: 240px;
			clear: both;
			background-color: #ffffff;
			margin: 20px;}
			
		#merge a, #merge a:visited {
			font-size: 11px;}
			
		#merge h3 {
			display: block;
			font-size: 11px;
			height: 24px;
			background-image: url(../../uxmag.com/_images/merge/bgHeader.png);
			background-repeat: no-repeat;
			margin: 0px;
			padding: 0px;}
			
		#merge h3 a, #merge h3 a:visited {
			padding: 5px 0px 0px 8px;
			display: block;
			background-image: none;
			font-weight: bold;}
		
/*	Snap Shot
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
			
		#magic-1024 #snapshot {
			background-image: url(../_images/lonuevo.png);
			border-width: 5px 0px 0px 5px;
			border-color: #fff;
			border-style: solid;
			float: left;
			width: 245px;
			height: 236px;
			overflow: hidden;
			font-size: 11px;
			border-bottom: solid #ccc 1px;}
			
			
		#magic-1024 #snapshot #update {
			margin: 27px 6px 0px 6px;
			border-bottom: solid #ccc 1px;
			padding: 1px 0px 0px 24px;
			height: 170px;
			background-repeat: no-repeat;
			background-image: url(../_images/icon_update.png);}
			
			
		#magic-1024 #snapshot #toolkit {
			margin: 0px 5px 0px 5px;
			border-bottom: solid #ccc 1px;
			padding: 3px 0px 0px 24px;
			height: 18px;
			background-repeat: no-repeat;
			background-image: url(../_images/icon_toolkit.png);}
			
			
		#magic-1024 #snapshot #hotTopics {
			margin: 5px 0px 0px 6px;
			padding: 3px 0px 0px 6px;
			height: 24px;
			width: 210px;
			background-repeat: no-repeat;
			background-image: url(../_images/facebooklogo.jpg);
			}
			
		#magic-1024 #snapshot #hotTopics a {
			height: 24px;
			width: 210px;
			display: block;
			border: none;
			background-image: none; }
			
	/*	#magic-1024 #snapshot #hotTopics {
			margin: 0px 5px 0px 2px;
			padding: 3px 0px 0px 24px;
			height: 16px;
			background-repeat: no-repeat;
			background-image: url(../_images/icon_hot.png);}
/*	Sound Byte
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
		
		#magic-1024 .listImage {
			float: left;
			background-color: #eee;
			border-width: 5px 0px 0px 5px;
			border-color: #ffffff;
			border-style: solid;
			width: 232px;
			height:	182px;
			padding: 6px;
			overflow: visible; }
			
		#magic-1024 .listImagetesti {
			float: left;
			background-color: #eee;
			border-width: 5px 0px 0px 5px;
			border-color: #ffffff;
			border-style: solid;
			width: 232px;
			height:	332px;
			padding: 0px;
			overflow: visible; }
			
		#magic-1024 .listImage #bullet {
			height: 20px;
			width: 27px;
			position: absolute;
			background-image: url(../_images/bullet_soundbyte.png);
			background-repeat: no-repeat;
			margin: -16px 0px 0px 140px;}

		#magic-1024 #soundbyte {
			color: #999;
			font-size: 11px;
			background-image: url(../_images/bg_soundbyte.png);
			width: 225px;
			height: 112px;
			border-width: 5px 0px 0px 5px;
			border-color: #ffffff;
			border-style: solid;
			line-height: 100%;
			float: left;
			padding: 10px;
			overflow: visible;
			font-weight: lighter; }
			
		#magic-1024 #soundbyte .quotes {
			display: none;
			background-image: url(../_images/soundbyte_quote.png);
			background-repeat: no-repeat;
			height: 14px;
			width: 20px; }
			
		#magic-1024 #soundbyte .words {
			color: #fff;
			letter-spacing: -0.5pt;
			font-family: Georgia, "Times New Roman", Times, serif;
			font-size: 21px;
			line-height: 90%;
			margin-top: 14px;
			padding: 1px;
			background-position: 0px 5px; }
			
		#magic-1024 #soundbyte .credits {
			margin-top: 8px;
			line-height: 120%;
			text-align: right;}
			
		#magic-1024 #soundbyte .credits a {
			color: #999; }
			
		#magic-1024 #soundbyte .credits a:hover {
			color: #fff; }
			
/*	Article Items
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
			
		#primary .listItem {
			font-size: 11px;
			font-family: Tahoma, Arial, Helvetica, sans-serif;
			float: left;
			background-color: #fff;
			border-width: 5px 0px 0px 5px;
			border-color: #ffffff;
			border-style: solid;
			overflow: hidden;}
			
		#primary .listItem a,
		#primary .listItem a:visited {
			display: block;
			color: #333;
			padding: 4px 6px 6px 6px;
			width: 231px;
			height: 100px;
			border: solid 1px #B8B8B8;
			background-image: none;}
			
		#primary .listItem a:hover {
			display: block;
			color: #000;
			padding: 4px 6px 6px 6px;
			width: 231px;
			height: 100px;
			border: solid 1px #333;}
		
		#primary .listItem p {
			display: inline;}

/*	Article Items: faq 
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
	
	#primary #faq .faq {
			background-color: #e7e7e7;
			display: block;
			margin: -3px -5px 2px -5px;
			padding: 2px 5px 3px 5px;
			color: #333;
			font-weight: bold;}
			
	#primary #faq .listItemfaq {
			font-size: 11px;
			font-family: Tahoma, Arial, Helvetica, sans-serif;
			float: left;
			background-color: #fff;
			border-width: 5px 0px 0px 5px;
			border-color: #ffffff;
			border-style: solid;
			overflow: hidden;}
				
		#primary #faq .listItemfaq a,	
		#primary #faq .listItemfaq a:visited {
			display: auto;
			color: #333;
			padding: 0px 0px 0px 0px;
			width: 200px;
			height: 40px;
			text-decoration: underline;
			background-image: none;}
			
		#primary  .listItemfaq a:hover {
			display: auto;
			color: #000;
			padding: 4px 6px 6px 6px;
			width: 200px;
			height: 100px;
			border: 0;}
		
		#primary  .listItemfaq p {
			display: inline;}
					
		#primary #faq .wordsfaq {
			color: #000;
			letter-spacing: -0.3pt;
			font-family: Georgia, "Times New Roman", Times, serif;
			font-size: 16px;
			line-height: 100%;
			margin-top: 12px;
			padding: 0px;
			background-position: 0px 5px; 
			background-color: #fff;
			display: block;
			margin: -3px -5px 2px 0px;
			padding: 2px 5px 3px 5px;
			color: #333;
			font-weight: bold;
			}
		
		#primary #faq .wordsfaq1 {
			color: #000;
			letter-spacing: -0.1pt;
			font-family: Georgia, "Times New Roman", Times, serif;
			font-size: 16px;
			font-weight: bold;
			margin: 4px 0px 3px 0px;
			/*line-height: 130%;
			margin-top: 12px;
			padding: 0px;
			background-position: 0px 5px; 
			background-color: #fff;
			display: block;
			padding: 2px 5px 3px 5px;
			color: #333;*/
			}
			
		#primary #faq .wordsfaq2 {
			font-size: 12px;
			color: #333;
			line-height: 130%;
			margin: 0px 0px 20px 25px;
			width: 700px; }
			
		#primary #faq .wordsfaq3 {
			font-size: 12px;
			color: #333;
			line-height: 130%;
			margin: 0px 2px 20px 0px;
			width: 710px; }
			
		#primary #copyright .wordsfaq a,
		#primary #what .wordsfaq a,
		#primary #who .wordsfaq a {
			color: #ddd;
			text-decoration: underline;
			border: none;
			display: inline;
			background-image: none; }
			
		#primary #copyright .wordsfaq a:hover,
		#primary #what .wordsfaq a:hover,
		#primary #who .wordsfaq a:hover {
			color: #fff;
			background-image: none; }
			
/*	Article Items: icons and colours
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
	
		#primary .des .icon {
			background-image: url(../_images/icon_design.png);
			background-repeat: no-repeat;
			height: 17px;
			width: 14px;
			margin: -4px -2px 0px 2px;
			float: right;}

		#primary .des {
			background-color: #e7e7e7;
			display: block;
			margin: -3px -5px 2px -5px;
			padding: 2px 5px 3px 5px;
			color: #333;
			font-weight: bold;}
			
		#primary .tech .icon {
			background-image: url(../_images/icon_tech.png);
			background-repeat: no-repeat;
			height: 17px;
			width: 14px;
			margin: -4px -2px 0px 2px;
			float: right;}

		#primary .tech {
			background-color: #e7e7e7;
			display: block;
			margin: -3px -5px 2px -5px;
			padding: 2px 5px 3px 5px;
			color: #333;
			font-weight: bold;}
			
		#primary .strat .icon {
			background-image: url(../_images/icon_strategy.png);
			background-repeat: no-repeat;
			height: 17px;
			width: 14px;
			margin: -4px -2px 0px 2px;
			float: right;}

		#primary .strat {
			background-color: #e7e7e7;
			display: block;
			margin: -3px -5px 2px -5px;
			padding: 2px 5px 3px 5px;
			color: #333;
			font-weight: bold;}
			
			
		#primary .internal .icon {
			background-image: url(../_images/icon_int.png);
			background-repeat: no-repeat;
			height: 17px;
			width: 14px;
			margin: -4px -2px 0px 2px;
			float: right;}

		#primary .internal {
			background-color: #e7e7e7;
			display: block;
			margin: -3px -5px 2px -5px;
			padding: 2px 5px 3px 5px;
			color: #333;
			font-weight: bold;}
			

			
/*	Site Info
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
			
		#primary #copyright { 
			background-color: #f5f3de;
			border-width: 5px 0px 0px 5px;
			border-color: #fff;
			border-style: solid;
			margin: 0px;
			padding: 0px;
			width: 245px;
			height: 120px;
			float: left;
			overflow: hidden;
			display: inline; }
			
		#primary #copyright .logo {
			background-image: url(../_images/uxm_copyright_logo.gif);
			background-repeat: no-repeat;
			background-position: top left;
			margin: 15px 0px 0px 15px;
			padding: 0px;
			width: 75px;
			height: 20px; } 
			
		#primary #what { 
			background-color: #f5f3de;
			border-width: 5px 0px 0px 5px;
			border-color: #fff;
			border-style: solid;
			margin: 0px;
			padding: 0px;
			width: 245px;
			height: 120px;
			float: left;
			overflow: hidden;
			display: inline; }
			
		#primary #what .title {
			background-image: url(../_images/title_que.gif);
			background-repeat: no-repeat;
			background-position: top left;
			margin: 15px 0px 0px 15px;
			padding: 0px;
			height: 22px;
			width: 55px;} 
			
		#primary #who {
			background-color: #f5f3de;
			border-width: 5px 0px 0px 5px;
			border-color: #fff;
			border-style: solid;
			margin: 0px;
			padding: 0px;
			width: 245px;
			height: 120px;
			float: left;
			overflow: hidden;
			display: inline; }
			
		#primary #who .title {
			background-image: url(../_images/title_donde.gif);
			background-repeat: no-repeat;
			background-position: top left;
			margin: 15px 0px 0px 15px;
			padding: 0px;
			width: 68px;
			height: 22px;} 

		#primary #copyright .words,
		#primary #what .words,
		#primary #who .words {
			font-size: 10px;
			color: #000;
			line-height: 130%;
			margin: 0px 0px 0px 15px;
			width: 215px; }
			
		#primary #copyright .words a,
		#primary #what .words a,
		#primary #who .words a {
			color: #ddd;
			text-decoration: underline;
			border: none;
			display: inline;
			background-image: none; }
			
		#primary #copyright .words a:hover,
		#primary #what .words a:hover,
		#primary #who .words a:hover {
			color: #fff;
			background-image: none; }






/*	-------------------------------------------------------------
	Magic Column Styles (styles in alternate CSS's)
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
	includes:	Thing of Beauty, Link Pool, Feed Merge
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
			
/*	Thing of beauty
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	
	
		#magic-800 .tob,
		#magic-1024 .tob {
			border-width: 5px 0px 0px 5px;
			border-color: #fff;
			border-style: solid;
			float: left;
			width: 245px;
			height: 245px;
			overflow: hidden; }
			
		#magic-800 .tob a,
		#magic-1024 .tob a:hover {
			display: block;
			border: none;
			margin: 0px;
			padding: 0px; }*/
			
/*	linkPool & feedMerge
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	
	
		#magic-800 .linkPool,
		#magic-1024 .linkPool,
		#magic-800 .feedMerge,
		#magic-1024 .feedMerge {
			font-size: 11px;
			border-width: 5px 0px 0px 5px;
			border-color: #fff;
			border-style: solid;
			float: left;
			width: 245px;
			height: 245px;
			overflow: hidden; }
	
		#magic-800 .linkPool .title,
		#magic-1024 .linkPool .title,
		#magic-800 .feedMerge .title,
		#magic-1024 .feedMerge .title {
			background-position: left;
			background-repeat: no-repeat;
			background-color: #cc0001;
			height: 25px;
			width: 245px;
			margin: 0px;
			padding: 0px;
			border: none;
			overflow: hidden; }
	
		#magic-800 .linkPool .title,
		#magic-1024 .linkPool .title {
			background-image: url(../_images/title_linkpool.gif); }
	
		#magic-800 .feedMerge .title,
		#magic-1024 .feedMerge .title {
			background-image: url(../_images/title_feedmerge.gif); }
	
		#magic-800 .linkPool span,
		#magic-1024 .linkPool span  {
			background-image: url(../_images/tooltip_error_bg.gif);
			background-position: bottom;
			background-repeat: no-repeat;
			font-size: 11px;
			font-weight: bold;
			color: #c00;
			display: block;
			height: 18px;
			width: 225px;
			margin: 0px;
			padding: 4px 0px 0px 20px;
			border: none;
			overflow: hidden; }
	
		#magic-800 .linkPool a,
		#magic-1024 .linkPool a,
		#magic-800 .feedMerge a,
		#magic-1024 .feedMerge a {
			display: block;
			border: 1px solid #dddddd;
			border-width: 0px 0px 1px 0px;
			padding: 4px 0px 4px 18px;
			margin: 0px;
			background-image: url(../_images/list_icon.gif);
			background-repeat: no-repeat;
			background-position: -2px 4px;
			overflow: hidden; }
	
		#magic-800 .linkPool a:hover,
		#magic-1024 .linkPool a:hover,
		#magic-800 .feedMerge a:hover,
		#magic-1024 .feedMerge a:hover {
			background-color: #f7f7f7;
			color: #cc0000; }
			
		.feedmerge_source {
			font-weight: bold;
			margin-right: 5px;
			color: #666; }
			
		.linkpool_text,
		.feedmerge_text {
			background-image: url(../_images/tooltip_linkpool_bg.gif);
			background-position: left;
			background-repeat: no-repeat;
			padding: 3px 5px 3px 6px;
			width: 234px;
			height: 18px;
			display: block;
			color: #666;
			font-size: 11px;
			overflow: hidden; }
			
		#magic-800 .linkPool .footer,
		#magic-1024 .linkPool .footer {
			background-color: #f3f3f3;
			border-bottom: 1px solid #ccc;
			height: 18px;
			line-height: 1.1em;
			font-size: 11px;
			color: #666;
			padding: 3px 5px 0px 5px; }
			
		#magic-800 .feedMerge .footer,
		#magic-1024 .feedMerge .footer {
			background-color: #f3f3f3;
			border-bottom: 1px solid #ccc;
			height: 38px;
			line-height: 1.1em;
			font-size: 11px;
			color: #666;
			padding: 2px 5px 3px 5px; }*/



/*	#############################################################
	Footer
	#############################################################
	#############################################################	*/
	
/*	-------------------------------------------------------------
	Footer Block (width styles in alternate CSS's)
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	
	
		#footer {
			margin: 0px 0px 0px 0px;
			padding: 0px; }*/
						
/*	Validation
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
	
		#footer #links {
			margin: 5px 0px 0px 5px;
			border-top: solid 1px #cccccc;
			background-color: #eee;
			font-size: 11px;
			color: #666;
			float: left;
			padding: 10px;
			overflow: hidden; }
			

			
/*	Settings
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
	
		#footer #settings {
			margin: 5px 0px 10px 5px;
			border-top: solid 1px #cccccc;
			border-bottom: solid 1px #cccccc;
			background-color: #fff;
			font-size: 11px;
			color: #666;
			float: left;
			padding: 6px 0px 0px 6px;
			overflow: hidden;
			background-image: url(../_images/logowebpd.gif);
			background-repeat: no-repeat;}
			
		#footer #settings  a {
			overflow: hidden;
			display: block;
			border: none;
			background-image: none; 
			width: 245px;
			height: 60px;}
			
			

			
	
