/* Osvaldo Ivan Osorio osvaldo.osorio@gmail.com www.oswosmedia.com */ /* RESET */ * { margin: 0; padding: 0; } html { overflow-y: scroll; } html, body { height: 100%; } body { background: #000; } body,td,ul,th { font-size: 13px; font-family: "Lucida Sans Unicode", "Trebuchet MS", "Arial Narrow"; color: #fff; line-height:1.4em; } ul,ol { margin:0; padding:0; list-style:none; } a { outline: none; text-decoration: none; } a img { border: none; background: none; } img { vertical-align: middle; } table { border-collapse: collapse; } /* UTILITY */ .floatLeft { float: left; } .floatRight { float: right; } .clear { clear: both; } .button { border: 1px solid #272727; background: white; padding: 3px 8px; -moz-border-radius: 5px; -webkit-border-radius: 5px; color: 272727; } .button:hover { background: #0099FF; color: white; } /* TYPGROGRAPHY */ p { margin: 0 0 10px 0; } a { color: #fff; text-decoration:underline; } a:hover, #currentA a { color: #FFCC00; text-decoration:underline; } h1 { font-size: 2.6em; font-weight: normal; line-height:1.2em; } h2 { font-size: 1.7em; margin: 6px 0 10px 0; text-align:left; } h3 { font-size: 1.8em; margin: 0 0 10px 0; } h4 { color: white; font-size: 2.0em; margin-bottom: 15px; } h1, h2,h3,h4 { } /* FORMS */ input { padding: 3px; } /* STRUCTURE */ #page-wrap { width: 980px; margin:0px auto -50px auto; min-height: 100%; height: auto !important; height: 100%; padding:0 0px; position:relative;} #top { position:relative; padding: 0px 0 0 0; height:198px; } #bannersA { position:absolute; top:20px; right:0; width:600px; height:100px; overflow:hidden; text-align:right; padding:0px 0 0 0; position: absolute; top: 76px; right:0px; z-index:109} #logo { width: 348px; height: 122px; float:left; padding:10px 0 0 0; position: absolute; top: 66px; left: 0px; z-index:109;} #push { height: 50px; } #anim { float:left; width:725px; height:303px; margin:0px 0 0 0; overflow:hidden; } ul#portfolio { margin:0; padding:0; list-style:none;} #loultimo { float:right; margin:0 0 0 10px; width:242px; height:303px; background:url(../images/bg_loultimo.jpg) top left no-repeat;} #loultimo .in { padding:74px 20px 10px 20px; height:205px; overflow:hidden; } /* MENU */ #menu-bar { clear:both; height:40px; padding:0; margin:0; } ul#main-nav { background:#E31269; list-style:none; height:40px; padding:0px 20px; margin:0; } ul#main-nav li { float:left; border-right:1px solid #A90E50; border-left:1px solid #F58BB9; margin:4px 0; } ul#main-nav .first { border-right:1px solid #A90E50; border-left:none;} ul#main-nav .last { border-right:none; border-left:1px solid #F58BB9;} ul#main-nav li a, ul#main-nav li a:visited { display:block; padding:4px 12px 4px 12px; text-transform: uppercase; color: #fff; font-size: 16px; line-height:normal; text-decoration:none; font-weight:bold; font-family:"Century Gothic", "Trebuchet MS", Tahoma; } ul#main-nav li a:hover { background:#000; text-decoration:none; } ul#main-nav #current a:link, ul#main-nav #current a:visited { color: #fff; background:#FFCC00;} #menu-a { float:left; width:20px; height:37px; background:url(../images/menu_a.jpg) no-repeat top left; } #menu-b { float:right; width:20px; height:37px;background:url(../images/menu_b.jpg) no-repeat top left;} /* INTERFAZ */ .box { width:280px; float:left; margin-right:27px; padding:16px 0px; background:#381B48; } .right { width:280px; float:right; margin-right:0px; padding:16px 0; } #pageheader { clear:both; height:60px; margin:0px 0 10px 0; border-bottom:1px dotted #C9CDD6;} #pageheader h1 { color:#C9CDD6; font-size:38px; padding:26px 0px 20px 20px; text-align:right; text-transform:uppercase; } #categorias { margin:0 0 18px 0; } #categorias ul { margin:0; padding:0; list-style:none;} #categorias ul li { padding:6px 0; border-bottom:1px dotted #333333;} #categorias ul a { display:block; padding:0 10px; border-left:2px solid #000; } #categorias ul a:hover { border-left:2px solid #FFCC00; } /* CONTENIDO DEL HOME */ #calendario { width:485px; float:left; margin:0 12px 10px 0; height:540px;} #comentarios { width:205px; float:left; margin:0 12px 10px 0; height:540px;} #blog { width:255px; float:right; margin:0 0px 10px 0; height:540px;} .fondo { background-color:#000; border:1px solid #333; } .in { padding:20px 10px 10px 10px; } .in h1 { padding:0px 0px 20px 0px; } #calendario .item { padding:6px 0; } #calendario .fecha { float:left; width:40px; padding:3px; margin:0 6px 30px 0; background:#BF4473;} #calendario .dia { font-size:18px; font-weight:bold; clear:both;} #calendario .mes { font-size:10px; clear:both;} #calendario p.titulo { font-weight:bold; margin:0; padding:0 0 0 54px;} #comentarios .item .texto { clear:both; background:#542564; padding:12px; color:#C58FD6; } #comentarios .item .autor { clear:both; background:url(../images/comentariopiquito.jpg) 20px 0px no-repeat; padding:24px 6px 6px 6px; height:60px; border-bottom:2px solid #542564; } #blog .item { padding:6px 0; } #blog a.title { font-weight:bold;} /* BARRA DE LOGOS */ #barra { width:980px; clear:both; margin:14px 0; padding:0; background:none;} #barra .item { width:220px; height:110px; float:left; margin-right:32px;} #barra .last { width:220px; height:110px; float:right; margin-right:0px;} #page { float:left; margin:0px 10px 0 0; width:520px; padding:0 40px 0 40px;} /* FOOTER */ #footer { margin: 0 auto; height: 100px; background:#990047 url(../images/bgpie2.jpg) top center repeat-x; padding: 44px 0px 0 0px; text-align:center; color:#fff; clear:both; } #footer-inside { width: 900px; margin: 0 auto; } #footer p { color: black; } #footer-1 { width: 280px; float: left; margin-right: 30px; } #footer-2 { width: 200px; float: left; margin-right: 30px; } #footer-3 { width: 200px; float: left; } #footer-4 { width: 388px; float: right; text-align:right; } #footer ul, #footer h4 { color: black; } #footer a{ color:#FFCC00;}