/*
-----------------------------------------------
Suburbe Template

Name:     Suburbe
URL:      www.hipertextos.net
Designer: hipertextos
URL:      www.hipertextos.net
Date:     1 ago 2010
----------------------------------------------- */

/* Basic Styles */

#navbar-iframe {
	height: 0px;
	visibility: hidden;
	display: none;
}

#space-for-ie {
	height: 0px;
	visibility: hidden;
	display: none;
	margin: 0px;
	padding: 0px;
}

* {
	border: none;
	margin: 0;
	padding: 0;
}

body {
	background:#fff;
	font: small/1.2 "Helvetica Neue", Helvetica, Verdana, Arial, sans-serif;
	text-align: center;
}

pre {
	display: block;
	margin: 1em 0 0 0;
	width: 100%;
}

pre code {
	background: #eee;
	display: block;
	padding: 10px;
}

/* Fonts */

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

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

a:visited {
	color: #B6AC9E;
	text-decoration: none;
}

a:visited:hover {
	color: #333333;
	text-decoration: underline;
}
h1 {
	display: block;
	font-family:Helvetica, Arial, Sans Serif;
	font-size: 1em;
	font-weight: normal;
	line-height:1em;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	text-align: center;
	text-shadow: 0 1px 1px rgba(255,255,255,.5);
}

h2 {
	font-size: 1em;
	padding: 0px;
	text-align: center;
	text-shadow: 0 1px 1px rgba(255,255,255,.5);
}

h3 {
	font-size: 1em;
	padding: 0px;
	text-align: center;
	text-shadow: 0 1px 1px rgba(255,255,255,.5);
}

h4 {
	font-size:2.1em;
	padding: 0px;
	text-align: center;
	text-shadow: 0 1px 1px rgba(255,255,255,.5);
}
h5,h6,h7 {
	clear:both;
	font-size:2em;
	margin:10px;
	text-align: center;
	text-shadow: 0 1px 1px rgba(255,255,255,.5);
}
p {
	
}

ul {
	list-style: none;
}

li {
	list-style: none;
}

li a {
	display: block;
	text-decoration: none;
}

blockquote {
	background:url('http://suburbe.org/img/blockquote.jpg') no-repeat left top #fff;
	border-left: 2px solid #eee;
	margin: 0px 0px 50px 80px;
	padding: 0px 40px;
}
embed {
	display:block;
	margin: 0 auto;
}

/* Estructure (default) */

#bodybg {
	background:url('http://suburbe.org/img/bgsuburbetexture.jpg') no-repeat center top #fff;
	margin:-30px 0px 0px;
	padding:10px 0px 0px;
}
#wrap {
	margin: 0 auto 0;
	width: 1024px;
	position: relative;
	overflow: hidden;
	text-align: left;
}

#head {
	margin: -5px auto 0px;
}

#content {
	float: left;
	width: 1024px;
}

#main {
	padding: 10px;
}

/* InfoBox & TvBox
----------------------------------------------- */
#infobox {
	height:512;
	margin:-512px 0px 30px;
	padding:0px 0px 0px;
}
#infobox.suburbe {
	background:url('http://suburbe.org/img/bgsenefasuburbe.jpg') no-repeat center bottom #fff;
}
#infobox.propagant {
	background:url('http://suburbe.org/img/bgsenefapropagant.jpg') no-repeat center bottom #fff;
}
#infobox.reciclant {
	background:url('http://suburbe.org/img/bgsenefareciclant.jpg') no-repeat center bottom #fff;
}
#infobox.transformant {
	background:url('http://suburbe.org/img/bgsenefatransformant.jpg') no-repeat center bottom #fff;
}
#infobox.cooperant {
	background:url('http://suburbe.org/img/bgsenefacooperant.jpg') no-repeat center bottom #fff;
}
#infoboxint {
	margin:512px auto 0px;
	padding:300px 0px 212px;
	width:1000px;
}
#infoboxint p {
	margin:10px auto;
	padding:5px;
}
#infoboxlauncher {
	display: block;
	float: left;
	margin: 20px 15px 5px;
	width:75px;
	text-align: left;
}
#infoboxlauncher img {
	background:#ddd;
	float:left;
	padding:3px;
	width:16px;
}
#tvbox {
	margin:40px 0px;
}
#tvboxint {
	background:#eee;
	margin:10px;
	padding:30px 10px 10px 10px;
	width:940px;
	-webkit-border-radius: 6px;
	-opera-border-radius: 6px;
	-moz-border-radius: 6px;
	box-shadow: 5px 5px 5px #333;
	-moz-box-shadow: 5px 5px 5px #333;
	-webkit-box-shadow: 5px 5px 5px #333;
}

/* Languages
----------------------------------------------- */
#languages {
	display: block;
	float: left;
	margin: 20px 15px 5px;
	width: 150px;
	text-align: left;
}
#languages img {
	background:#ddd;
	float:left;
	height:16px;
	padding:3px;
	width:18px;
}

/* Search-Box
----------------------------------------------- */
#search-box {
	display: block;
	float: right;
	margin: 20px 40px 5px 0px;
	width: 300px;
	text-align: right;
}

#search-box input {
	padding:2px;
	-webkit-border-radius: 6px;
	-opera-border-radius: 6px;
	-moz-border-radius: 6px;
	box-shadow:inset 2px 2px 2px #666;
	-moz-box-shadow:inset 2px 2px 2px #666;
	-webkit-box-shadow:inset 2px 2px 2px #666;
}

/* Menu
----------------------------------------------- */

#menu {
	clear: both;
	line-height: 1em;
	width: 100%;
	max-width: 980px;
}

#menu ul {
	margin: 0px;
	padding: 0px;
	text-align: center;
	width: 100%;
}

#menu li {
	font-size: 14px;
	font-weight: bold;
	float: left;
	margin: 0px 0px;
	text-align: center;
	width: 20%;
	max-width: 200px;
}

#menu li a {
	background: url('http://suburbe.org/img/menuitembase.jpg') no-repeat left top;
	color: #333;
	display: block;
	padding: 8px 10px 8px 10px;
	box-shadow: 5px 5px 5px #333;
	-moz-box-shadow: 5px 5px 5px #333;
	-webkit-box-shadow: 5px 5px 5px #333;
	-webkit-border-radius: 6px;
	-opera-border-radius: 6px;
	-moz-border-radius: 6px;
	text-shadow: 0 1px 1px #fff;
}

#menu a:hover {
	background: url('http://suburbe.org/img/menuitem.jpg') no-repeat left top;
	color: #fff;
	text-decoration: none;
	text-shadow: 0 1px 1px #000;
}

#menu a:visited {
	color: #444;
}

#menu a.helpactive {
	background: url('http://suburbe.org/img/menuitem.jpg') no-repeat left top;
	color: #fff;
	text-decoration: none;
	text-shadow: 0 1px 1px #000;
}

#menu a:visited:hover {
	color: #fff;
}

#menu span {
	font-size: 10px;
	display:block;
}

/* Breadcrumb
----------------------------------------------- */

#breadcrumb {
	color:#777;
	clear:both;
	font-size: 1em;
	font-weight: bold;
	height:18px;
	margin: 8px 0px -10px;
	overflow:hidden;
	padding: 0px;
	width:96%;
	text-shadow: 0 1px 1px rgba(255,255,255,.5);
}

#breadcrumbleft {
	float: left;
	margin:0px 5px;
	width: 80%;
	text-align: left;
}

#breadcrumbright {
	float: right;
	text-align: right;
	width: 10%;
}
#breadcrumb a {
	color:#555;
}
#breadcrumb a:hover {
	color:#777;
}

/* Dock
----------------------------------------------- */
.dock {
	clear: both;
	display: block;
	height: 80px;
	margin: -10px auto 5px;
	padding: 0px 0px 0px;
	width: 520px;
}

.dockitem {
	float: left;
	margin: 2px;
	width: 10%;
}

.dockitem img {
	background: transparent;
	border: none;
	margin: 0px;
	width: 90%;
}

.dockitem img:hover {
	margin: -30% 5% 5% -30%;
	width: 140%;
}

/* SocialDock
----------------------------------------------- */

.socialdock {
	clear: both;
	display: block;
	height: 60px;
	padding: 5px 0px 20px;
	width: 100%;
}

.socialdockitem {
	background: #fff;
	border: 4px solid #ddd;
	float: left;
	margin: 1px;
	width: 5%;
}

.socialdockitem img {
	background: transparent;
	border: none;
	margin: 0px;
	width: 100%;
}

.socialdockitem img:hover {
	margin: -10px;
	width: 60px;
}

/* Portada
----------------------------------------------- */

.portada {
	margin: 0px auto 40px;
	padding: 0px;
}

.portada img {
	background:transparent;
	height:auto;
	width: 100%;
}

.submenu {
	clear:both;
	display:block;
	font-size:1em;
	height:18px;
	margin:1px 0px;
	text-align:right;
	width:96%;
}
.submenu ul {
	clear:both;
	margin:0px;
	width:100%;
}
.submenu li {
	float:right;
	margin:0px 5%;
}
.submenu li a {
	color:#333;
	display:block;
	font-weight:bold;
}
#slideshow {
	clear: both;
	position: relative;
	height: 720px;
	margin:0px;
	overflow: hidden;
	width:96%;
}

#slideshow IMG {
	background:#fff;
	border:4px solid #eee;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 8;
}

#slideshow IMG.active {
	z-index: 10;
}

#slideshow IMG.last-active {
	z-index: 9;
}

/* Post Portada
----------------------------------------------- */

.blog {
	margin: 0px auto 20px;
	width: 100%;
}

.post-portada {
	margin: 1px;
	float: left;
	height:220px;
	margin:10px 5px 10px;
	width: 22%;
	-webkit-transform: rotate(-1deg);
	-moz-transform: rotate(-1deg);
	transform: rotate(-1deg);
}

.post-portada img {
	background: #eee;
	border: 1px solid #ddd;
	max-height:180px;
	padding: 4px;
	width: 98%;
	box-shadow: 5px 5px 5px #666;
	-moz-box-shadow: 5px 5px 5px #666;
	-webkit-box-shadow: 5px 5px 5px #666;
}

.post-portada:first-child {
	height:360px;
	margin: 1px;
	width: 48%;
	-webkit-transform: rotate(1deg);
	-moz-transform: rotate(1deg);
	transform: rotate(1deg);
}

.post-portada:first-child img {
	max-height:380px;
	padding: 5px;
	width: 96%;
}

.post-portada:first-child h3 {
	font-size: 2em;
	margin: 10px auto;
}

.post-portada img:hover {
	background: #ddd;
	border: 1px solid #ccc;
}

/* Post Item
----------------------------------------------- */
.post {
	margin: 0px;
	padding: 0px 0px;
	width: 100%;
}
.post img.post {
	background: #eee;
	border: 1px solid #ddd;
	float: left;
	margin: 20px auto;
	padding: 5px;
	width: 10%;
	box-shadow: 5px 5px 5px #333;
	-moz-box-shadow: 5px 5px 5px #333;
	-webkit-box-shadow: 5px 5px 5px #333;
	-webkit-transform: rotate(1deg);
	-moz-transform: rotate(1deg);
	transform: rotate(1deg);
}
.post-body {
	display: block;
	float: right;
	margin: 50px 0px 0px;
	text-align: justify;
	width: 88%;
}
.post-body img {
	float: left;
	height: auto;
	margin: 1%;
	padding: 1%;
	width: 21%;
}
.post-body img.mural {
	float: left;
	height: auto;
	margin:1%;
	padding:1%;
	width: 46%;
}
.post-body img.big {
	clear: both;
	float: none;
	height: auto;
	margin: 3px auto;
	padding: 5px 1px;
	width: 100%;
}
.muralHD {
	display: block;
	float: left;
	font-size: 1.2em;
	margin: 3px;
	padding: 5px;
	text-align: center;
	width: 46%;
}
.post-footer {
	clear: both;
	line-height:2.4em;
	margin: 20px auto;
	text-align:center;
	width: 100%;
}
.post-footer p {
	
}
.post-footer a {
	background: #fff;
	border: 2px solid #aaa;
	color: rgb(76,86,108);
	font-weight: bold;
	font-size: 12px;
	margin: 0px 5px;
	padding: 5px 15px;
	-webkit-border-radius: 6px;
	-opera-border-radius: 6px;
	-moz-border-radius: 6px;
	box-shadow:inset 2px 2px 2px #666;
	-moz-box-shadow:inset 2px 2px 2px #666;
	-webkit-box-shadow:inset 2px 2px 2px #666;
}
.post-footer a:hover {
	background:#655B4C;
	border:2px solid #ddd;
	color:#fff;
}
p.blogger-labels {
	background: url('http://suburbe.org/img/tags.png') no-repeat left center transparent;
	clear: both;
	display: block;
	font-size: 0em;
	line-height:2.4em;
	margin: 10px;
	padding: 10px 0px 10px 70px;
	text-align: left;
}
p.blogger-labels a {
	background: #fff;
	border: 2px solid #aaa;
	color: rgb(76,86,108);
	font-weight: bold;
	font-size: 12px;
	margin: 0px 5px;
	padding: 5px 10px;
	-webkit-border-radius: 6px;
	-opera-border-radius: 6px;
	-moz-border-radius: 6px;
	box-shadow:inset 2px 2px 2px #666;
	-moz-box-shadow:inset 2px 2px 2px #666;
	-webkit-box-shadow:inset 2px 2px 2px #666;
}
p.blogger-labels a:hover {
	background:#655B4C;
	border: 2px solid #ddd;
	color:#fff;
}
.comments {
	float: right;
	padding: 20px 20px 20px;
	width: 90%;
}
#comments-block {
	background: #eee;
	border: 1px solid #ddd;
	font-size: 1.4em;
	line-height: 1.6em;
	margin-bottom: 20px;
	padding: 10px;
	-webkit-border-radius: 6px;
	-opera-border-radius: 6px;
	-moz-border-radius: 6px;
}
.comment-body {
	background: #ddd;
	border: 1px solid #aaa;
	color: #555;
	font-size: 0.9em;
	margin: 10px;
	padding: 10px;
	text-align: justify;
	-webkit-border-radius: 6px;
	-opera-border-radius: 6px;
	-moz-border-radius: 6px;
}
.comment-timestamp {
	font-size: 0.9em;
}
a.comment-link {
	font-size: 1.2em;
	color: rgb(76,86,108);
	font-weight: bold;
}
.home-previous {
	margin: 20px auto;
	text-align:center;
}
.home-previous a {
	background: #fff;
	border: 2px solid #aaa;
	font-weight: bold;
	padding: 6px;
	-webkit-border-radius: 6px;
	-opera-border-radius: 6px;
	-moz-border-radius: 6px;
	box-shadow:inset 2px 2px 2px #666;
	-moz-box-shadow:inset 2px 2px 2px #666;
	-webkit-box-shadow:inset 2px 2px 2px #666;
}
.home-previous a:hover {
	background:#655B4C;
	border: 2px solid #ddd;
	color:#fff;
}

/* Previous Archive
----------------------------------------------- */
#previous-archive {
	margin:0px auto;
	width:90%;
}
.previous-item {
	display:block;
	float:left;
	font-weight:bold;
	margin:1%;
	min-height:160px;
	padding:1%;
	text-align:center;
	width:20%;
}
.previous-item a {
	display:block;
}
.previous-item img {
	background:#eee;
	border:1px solid #ddd;
	padding:2%;
	width:88%;
	max-width:180px;
}

/* Main Variations
----------------------------------------------- */

.mainbox {
	clear: both;
	margin: 30px auto;
	padding: 40px 0px 100px;
	width: 100%;
}

.leftcolumn {
	display: block;
	float: left;
	width: 9%;
}

.leftcolumn img {
	background: transparent;
	border: none;
	width: 90%;
}

.rightcolumn {
	display: block;
	float: left;
	width: 90%;
}

.tabs {
	padding: 0;
	margin: 0px auto 0px;
	display: block;
	text-align: left;
	width: 96%;
}

.tabs ul {
	display: block;
	height: 30px;
	margin: 0 0 0 0px;
	padding: 0;
}

.tabs li {
	display: block;
	float: left;
	margin: 0px 5px 0px;
	padding: 0;
	width: 15%;
}

.tabs a {
	
}

.tabs a span {
	background: #fff;
	font-weight: bold;
	float: left;
	font-size:0.9em;
	display: block;
	padding: 10px 9px 10px 6px;
	-moz-box-shadow: 0px -8px 10px #666;
	-webkit-box-shadow: 0px -8px 10px #666;
	box-shadow: 0px -8px 10px #666;
}

.tabs a span {
	float: none;
}

#tabs a:hover {
	
}

.tabs a:hover span {
	
}

#first, #second, #third,#fourth,#fifth {
	background: #fff;
	border-bottom:4px solid #eee;
	clear: both;
	padding:15px 5px;
	text-align: justify;
	-moz-box-shadow: 5px 5px 10px #333;
	-webkit-box-shadow: 5px 5px 10px #333;
	box-shadow: 5px 5px 10px #333;
}

#first, #second, #third,#fourth,#fifth, p {
	clear: both;
	margin:2px;
}

#first li {
	clear:both;
	font-size: 1em;
	font-weight: normal;
	padding:10px;
	width:96%;
}
#first span {
	font-weight: bold;
}
#second {
	clear: both;
	padding: 10px;
	text-align: justify;
}

#third {
	clear: both;
	padding: 10px;
	text-align: justify;
}

#fourth {
	clear: both;
	padding: 10px;
	text-align: justify;
}

.contact {
	background: url('http://suburbe.org/images/link.gif') no-repeat left center;
	font-size: 24px;
	padding-left: 20px;
}

ul.starred {
	clear: both;
	margin: 10px 0px;
	width: 100%;
}

ul.starred li {
	font-size: 24px;
	margin: 10px 0px 30px;
	padding: 5px;
	width: 95%;
}

ul.starred li a {
	display: block;
	padding: 3px 15px;
	-webkit-border-radius: 12px;
	-opera-border-radius: 12px;
	-moz-border-radius: 12px;
}

ul.starred li span {
	background: transparent;
	border: none;
	font-size: 14px;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
}

#div-232331452023273919, #div-2387235646106461682 {
	background: #ccc;
	display: block;
	margin: 1px;
	padding: 10px;
	-webkit-border-radius: 12px;
	-opera-border-radius: 12px;
	-moz-border-radius: 12px;
	-moz-box-shadow:inset 5px 5px 10px #333;
	-webkit-box-shadow:inset 5px 5px 10px #333;
	box-shadow: 5px 5px 10px #333;
}

.left {
	float: left;
	width: 47%;
}

.right {
	float: right;
	width: 47%;
}

/* Footer
----------------------------------------------- */

#footer {
	clear: both;
	margin:0 auto;
	width: 96%;
}

#footer p {
	padding: 20px 30px;
	text-align: center;
}

.footerlogos {
	background:#fff;
	border-top:1px solid #eee;
	border-bottom:1px solid #eee;
	margin:20px auto 10px;
	padding:20px 20px 0px;
	text-align:center;
	-moz-box-shadow: 2px 2px 5px #333;
	-webkit-box-shadow:5px 5px 10px #333;
	box-shadow: 5px 5px 10px #333;
}
.footerlogos img {
	height:120px;
}

/* ---------------------------------------------------
			Feevy		
------------------------------------------------------ */
#feevyboxlauncher {
	display:block;
	float:right;
	margin:0px 50px -55px 0px;
	text-align:right;
	width:50px;
}
#feevyboxlauncher img {
	width:48px;
}
#feevybox {
	margin:100px auto;
}
#feevyboxint {
	display:block;
	margin:0px auto;
	padding:10px;
}
#feevy_bar_14378 .bar_content {
	margin: 0px auto;
        padding:25px 5px 0px;
	display: block;
}
#feevy_bar_14378 .feevy_item {
        background:#fff;
	border:1px solid #ccc;
	display: block;
	height: 95px;
	margin: 5px 10px;
	padding: 5px;
	text-align: left;
        float:left;
        font-size:0.8em;
        width:20%;
       -webkit-border-radius: 6px;
       -opera-border-radius: 6px;
       -moz-border-radius: 6px;
	filter: alpha(opacity=70);
	-moz-opacity: 0.70;
	opacity: 0.70;
	-moz-box-shadow: 2px 2px 5px #333;
	-webkit-box-shadow:5px 5px 10px #333;
	box-shadow: 5px 5px 10px #333;
}
#feevy_bar_14378 .feevy_item:hover {
        background:#fff;
	border:1px solid #999;
	filter: alpha(opacity=90);
	-moz-opacity: 0.90;
	opacity: 0.90;
	-moz-box-shadow: 2px 2px 5px #333;
	-webkit-box-shadow:5px 5px 10px #333;
	box-shadow: 5px 5px 10px #333;
}
#feevy_bar_14378 .feevy_title {
	display: block;
	font-weight: bold;
}

#feevy_bar_14378 .feevy_title h1 {
	line-height: 18px;
        font-size:1em;
        padding:5px 0px;
}

#feevy_bar_14378 .feevy_title a {
	color: #AA0000;
	text-decoration: none;
}

#feevy_bar_14378 .feevy_title img {
	float: left;
	margin: 5px 5px 0px 0px;
	padding: 5px;
}

#feevy_bar_14378 .feevy_content {
       display:none;
}

#feevy_bar_14378 a.blog_url {
	color: #AA0000;
        display:block;
        font-size:14px;
        margin:10px 0px 0px;
        text-align:right;
        text-decoration:none;
}

#feevy_bar_14378 .footer {
	display:none;
}

#feevy_bar_14378 .item_content {
	display: table;
	display: block;
}

/* Viewport Variations
----------------------------------------------- */
@media only screen and (min-width: 768px) and (max-width: 1000px) {

/* 

portrait mode 
----------------------------------------------- */

#head,
#wrap {
	width: 770px;
}

#menu {
	width: 720px;
}

.menu-item {
	font-size: 1em;
}
#tvbox {
	display:none;
}
#main {
	float: left;
	width: 760px;
	position: relative;
	right: 30px;
	left: 0;
	padding: 0px;
}

.portada img {
	width: 760px;
}

#slideshow {
	height: 540px;
}

#div-232331452023273919 {
	display: none;
}

.leftcolumn {
	display: none;
}
.rightcolumn {
	font-size: 0.8em;
	margin:0;
	width:780px;
}
}

@media only screen and (max-width: 767px) {

/* iphone mode 
----------------------------------------------- */
#head,
#wrap {
	width: 100%;
}
#infobox,
#tvbox {
	display:none;
}
#infoboxlauncher {
	display:none;
}
#content {
	left: 0;
	width: 100%;
}

#main {
	float: none;
	width: 100%;
	position: relative;
	right: 0px;
	left: 0;
	padding: 20px 0;
}

#slideshow {
	height: 400px;
}
embed {
	display:none;
}
h4 {
	font-size:2em;
}
.post-portada, post-portada:first-child {
	height:auto;

}
.post-portada:first-child h3 {
	font-size: 1.2em;
}
.post-body {
	font-size: 0.9em;
	margin:20px;
	width:96%;
}
.post img.post {
	display:none;
}
.dock {
	height: 10px;
	margin:10px auto;
	width: 380px;
}
#menu {
	margin: 0 auto;
	width: 96%;
}
#menu li {
	font-size: 10px;
}
#menu li a {
	height:30px;
	padding:14px 0px 0px;
}
#menu span {
	display:none;
}
#breadcrumb {
	display:none;
}
#first {
	margin:5px 10px;
}
.rightcolumn {
	font-size: 0.8em;
	float:none;
	margin:0 auto;
	width:80%;
}

#div-232331452023273919 {
	display: none;
}

.leftcolumn {
	display: none;
}

}