/* Theme Name: BelloRed Author: Mainake Design Author URI: http://mariiiina.com/ Description: BelloRed is a multi-purpose responsive theme based on HTML5/CSS3, lightweight, and adaptable. BelloRed is responsive, it allows anyone to create a mobile friendly website compatible with all browsers and devices. It has a Theme Options panel to add your Social Links (facebook, twitter, youtube and RRSS). Version: 1.0.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: bellored Tags: black, custom-menu, Dark, Editor-Style, Fluid-Layout, Full-Width-Template, Gray, Light, One-Column, Responsive-Layout, Red, Right-Sidebar, Theme-Options, Two-Columns, White This theme, like WordPress, is licensed under the GPL. Use it to make something cool, have fun, and share what you've learned with others. bellored is based on Underscores http://underscores.me/, (C) 2012-2015 Automattic, Inc. Underscores is distributed under the terms of the GNU GPL v2 or later. Normalizing styles have been helped along thanks to the fine work of Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/ */ /*-------------------------------------------------------------- >>> TABLE OF CONTENTS: ---------------------------------------------------------------- # Normalize # Typography # Elements # Forms # Navigation ## Links ## Menus ###Small menu # Accessibility # Alignments # Clearings # Widgets # Sections ## Header ## Social & Search ## Footer # Content ## Posts and pages ## Page ## Single ## Asides ## Blog ## Comments # Media ## Captions ## Galleries # Media Queries ## max-width: 960px - min-width: 768px ## max-width: 767px ## max-width: 500px --------------------------------------------------------------*/ /*-------------------------------------------------------------- # Normalize --------------------------------------------------------------*/ html { font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } body { margin: 0; padding: 0px; } article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary { display: block; } audio, canvas, progress, video { display: inline-block; vertical-align: baseline; } audio:not([controls]) { display: none; height: 0; } [hidden], template { display: none; } a { background-color: transparent; } a:active, a:hover { outline: 0; } abbr[title] { border-bottom: 1px dotted; } b, strong { font-weight: bold; } dfn { font-style: italic; } mark { background: #ff0; color: #000; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } img { border: 0; } svg:not(:root) { overflow: hidden; } figure { margin: 1em 40px; } hr { box-sizing: content-box; height: 0; } pre { overflow: auto; } code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; } fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } legend { border: 0; padding: 0; } textarea { overflow: auto; } optgroup { font-weight: bold; } table { border-collapse: collapse; border-spacing: 0; } td, th { padding: 0; } /*-------------------------------------------------------------- # Typography --------------------------------------------------------------*/ body { font: 90% 'Raleway', "Helvetica", Arial, sans-serif; line-height: 1.5em; text-align: left; color: #000; } select, textarea { color: #404040; font-family: sans-serif; font-size: 16px; font-size: 1rem; line-height: 1.5; } h1, h2, h3, h4, h5, h6 { clear: both; } p { font: normal 14px/20px Arial, Helvetica, Garuda, sans-serif; color: #333; padding: 0px 0px 20px; margin: 0px; } h1 { color: #fff; font-size: 60px; margin: 20px 0px 0px 7px; line-height: 50px; } h2 { color: #41423c; margin-bottom: 10px; font-size: 15px; line-height: 1.2em; text-align: center; text-transform: uppercase; } h2 a, h2 a:visited { color: #41423c; text-decoration: none; font-weight: 500; } h2 a:hover { color: #111111; } h3 { color: #000; margin: 10px 0px 5px; } h4 { color: #fff; margin: 0px; } dfn, cite, em, i { font-style: italic; } blockquote { margin: 0 1.5em; } address { margin: 0 0 1.5em; } pre { background: #eee; font-family: "Courier 10 Pitch", Courier, monospace; font-size: 15px; font-size: 0.9375rem; line-height: 1.6; margin-bottom: 1.6em; max-width: 100%; overflow: auto; padding: 1.6em; } code, kbd, tt, var { font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; font-size: 15px; font-size: 0.9375rem; } abbr, acronym { border-bottom: 1px dotted #666; cursor: help; } mark, ins { background: #fff9c0; text-decoration: none; } big { font-size: 125%; } /*-------------------------------------------------------------- # Elements --------------------------------------------------------------*/ html { box-sizing: border-box; } *, *:before, *:after { box-sizing: inherit; } body { background: url(img/bg/bg.png) repeat; } .pages { width: 960px; overflow: hidden; margin: 0px auto; padding: 0px; } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } hr { background-color: #ccc; border: 0; height: 1px; margin-bottom: 1.5em; } ul, ol { margin: 0; } ul { list-style: none; padding: 0; } ol { list-style: decimal; } li > ul, li > ol { margin-bottom: 0; } dt { font-weight: bold; } img { height: auto; max-width: 100%; } table { margin: 0 0 1.5em; width: 100%; } /*-------------------------------------------------------------- # Navigation --------------------------------------------------------------*/ #navigation { width: 650px; margin: 20px 0px; padding: 10px; clear: both; } .nav-links { width: 610px; display: block; clear: both; overflow: hidden; margin: 20px 0px 20px 16px; } .nav-previous { width: 50%; float: left; } .nav-next { width: 50%; float: right; text-align: right; } /*-------------------------------------------------------------- ## Links --------------------------------------------------------------*/ a, a:visited { font-weight: bold; color: #41423c; text-decoration: none; } a:hover, a:focus, a:active { color: #000; } a:focus { outline: thin dotted; } a:hover, a:active { outline: 0; } /*-------------------------------------------------------------- 5.2 Main Menu --------------------------------------------------------------*/ #backnav { width: 100%; height: 55px; margin: 0; background-color: #000; position: absolute; z-index: -2; } .main-navigation { display: block; width: 100%; clear: both; } .main-navigation ul { margin: 0; padding-left: 0; list-style: none; } .main-navigation li { position: relative; float: left; } .main-navigation a { display: block; text-decoration: none; text-transform: uppercase; list-style: none; line-height: 55px; padding: 0px 20px; color:#fff; font-size: 15px; font-weight: 500; -webkit-transition:all .65s; -moz-transition:all .65s; -ms-transition:all .65s; -o-transition:all .65s; transition:all .65s; } .main-navigation ul ul { position: absolute; left: 0; z-index: 99999; display: none; float: left; padding: 0; background: #000000; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2); } .main-navigation ul ul ul { top: 0; left: 100%; } .main-navigation ul ul a { width: 200px; line-height: 15px; padding: 10px 20px 10px 10px; } .main-navigation ul ul li { } .main-navigation li:hover > a, .main-navigation li > a:focus { color: #fff; background: #900; } .main-navigation ul ul :hover > a { } .main-navigation ul ul a:hover, .main-navigation ul ul a:focus { background: #900; } .main-navigation ul li:hover > ul { display: block; } .main-navigation .current_page_item > a, .main-navigation .current-menu-item > a, .main-navigation .current_page_item > a:hover, .main-navigation .current-menu-item > a:hover, .main-navigation .current_page_item > a:focus, .main-navigation .current-menu-item > a:focus { background-color:#900; font-weight: 700; color: #fff; } .main-navigation .current_page_ancestor { background-color:#900; } .main-navigation ul ul .current_page_parent, .main-navigation .current_page_parent .current_page_item > a { color: #fff; background-color:#900; } /* Small menu */ .menu-toggle { display: none; cursor: pointer; } @media screen and (max-width: 767px) { .pages { width: 100%; } .menu-toggle { display: inline-block; height: 55px; width: 100%; margin: 0; background-color: #000; border: solid 0px #000; color: #ffffff; cursor: pointer; } .menu-toggle:hover, .menu-toggle:focus { background: #900; } .main-navigation.toggled .nav-menu { display: block; border-top: solid 3px #A30005; } .main-navigation ul { display: none; padding-left: 0; } .main-navigation li { float: none; background: #000000; } .main-navigation li a { padding: 0 2em; } .main-navigation li li a { padding-left: 4em; } .main-navigation li li li a { padding-left: 6em; } .main-navigation li:hover > a, .main-navigation li > a:focus { background: #900; } .main-navigation ul ul, .main-navigation ul ul ul { position: relative; top: inherit; left: 0; display: block; float: none; background: #900; box-shadow: 0 0 0 rgba(0, 0, 0, 0.2); } .main-navigation ul ul a { width: 100%; } .main-navigation ul a:hover, .main-navigation ul a:focus { background: #900; } .main-navigation ul ul a:hover, .main-navigation ul ul a:focus { background: #A30005 } .main-navigation ul ul ul a:hover, .main-navigation ul ul ul a:focus { background: #A30405; } .main-navigation .current_page_ancestor, .main-navigation ul ul .current_page_parent, .main-navigation .current_page_item > a, .main-navigation .current_page_item > a:hover, .main-navigation .current_page_item li:hover, .main-navigation .current_page_item > a:focus, .main-navigation .current_page_item li:focus, .main-navigation .current_page_parent .current_page_item > a { color: #fff; background: #900; } } /*-------------------------------------------------------------- # Accessibility --------------------------------------------------------------*/ /* Text meant only for screen readers. */ .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; } .screen-reader-text:focus { background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; color: #21759b; display: block; font-size: 14px; font-size: 0.875rem; font-weight: bold; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; /* Above WP toolbar. */ } /*-------------------------------------------------------------- # Alignments --------------------------------------------------------------*/ .alignleft { display: inline; float: left; margin-right: 1.5em; } .alignright { display: inline; float: right; margin-left: 1.5em; } .aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; } /*-------------------------------------------------------------- # Clearings --------------------------------------------------------------*/ .clear:before, .clear:after, .entry-content:before, .entry-content:after, .comment-content:before, .comment-content:after, .site-header:before, .site-header:after, .site-content:before, .site-content:after, .site-footer:before, .site-footer:after { content: ""; display: table; } .clear:after, .entry-content:after, .comment-content:after, .site-header:after, .site-content:after, .site-footer:after { clear: both; } /*-------------------------------------------------------------- # Widgets --------------------------------------------------------------*/ .widget { display: block; margin: 0 0 1.5em; } /* Make sure select elements fit in widgets. */ .widget select { max-width: 100%; } /* Search widget. */ .widget_search .search-submit { display: none; } .widget_search input[type="search"] { height: 30px; color: #a0a09a; border: solid 1px #e4dede; background:-webkit-gradient(linear, 0% 84%, 0% 10%, from(#f5f5ec), to(#FFFFFF)); -moz-box-shadow:inset 1px 1px 3px #555555; -webkit-box-shadow:inset 1px 1px 3px #555555; box-shadow:inset 1px 1px 3px #555555; -moz-border-radius-topleft: 4px; -moz-border-radius-topright:4px; -moz-border-radius-bottomleft:4px; -moz-border-radius-bottomright:4px; -webkit-border-top-left-radius:4px; -webkit-border-top-right-radius:4px; -webkit-border-bottom-left-radius:4px; -webkit-border-bottom-right-radius:4px; border-top-left-radius:4px; border-top-right-radius:4px; border-bottom-left-radius:4px; border-bottom-right-radius:4px; } /* Calendar widget */ #wp-calendar { color: #ffffff; margin-left: 10px; } #wp-calendar thead, #wp-calendar a, #wp-calendar a:visited { color: #C20B0B !important; } #wp-calendar a:hover, #wp-calendar a:active { color: #ffffff !important; } /*-------------------------------------------------------------- # Sections --------------------------------------------------------------*/ /*------ ## Header ------*/ #backheader { position: absolute; z-index: -2; width: 100%; height: 181px; background: url(img/bg/bgheader.jpg) repeat-x; } .mainmenu { overflow: visible; } #headerimg { clear: both; height: 130px; } #logo h1 { margin-top: 50px; } #logo h1 a { color: #fff; font-size: 60px; margin-top: 20px; line-height: 40px; font-weight: normal; } .site-description { color: #fff; padding-left: 10px; } .shadow { background: url(img/shdw.png) no-repeat; height: 12px; width: 950px; margin: 1px auto; } /*------ ## Social & Search ------*/ .search-header { margin-top: 40px; } #barra { width: 100%; margin-top: 10px; } #rrss { overflow: hidden; width: 160px; float: left; margin-left: 56px; } #rrss ul { overflow: hidden; margin: 0px; padding: 0px; } #rrss li { float: left; list-style: none; } #rrss a { padding-right: 4px; padding-left: 4px; display: block; opacity: 1; -webkit-transition:all .65s; -moz-transition:all .65s; -ms-transition:all .65s; -o-transition:all .65s; transition:all .65s; } #rrss a:hover { opacity: 0.7; -webkit-transition:all .65s; -moz-transition:all .65s; -ms-transition:all .65s; -o-transition:all .65s; transition:all .65s; } #sub { width: 340px; float: left; margin-left: 26px; margin-right: 20px; } #search { float: left; width: 310px; } .sf_container { width: 310px !important; border: 0px solid #E4DEDE !important;} .sf_search { width: 310px !important; border: 0px solid #E4DEDE !important; } .sf_input { width: 218px; height: 30px; color: #a0a09a; margin-right: 9px; padding-left: 5px; border: solid 1px #e4dede; background:-webkit-gradient(linear, 0% 84%, 0% 10%, from(#f5f5ec), to(#FFFFFF)); -moz-box-shadow:inset 1px 1px 3px #555555; -webkit-box-shadow:inset 1px 1px 3px #555555; box-shadow:inset 1px 1px 3px #555555; -moz-border-radius-topleft: 4px; -moz-border-radius-topright:4px; -moz-border-radius-bottomleft:4px; -moz-border-radius-bottomright:4px; -webkit-border-top-left-radius:4px; -webkit-border-top-right-radius:4px; -webkit-border-bottom-left-radius:4px; -webkit-border-bottom-right-radius:4px; border-top-left-radius:4px; border-top-right-radius:4px; border-bottom-left-radius:4px; border-bottom-right-radius:4px; } .sbox { width: 218px; height: 30px; color: #a0a09a; margin-right: 9px; padding-left: 5px; border: solid 1px #e4dede; background:-webkit-gradient(linear, 0% 84%, 0% 10%, from(#f5f5ec), to(#FFFFFF)); -moz-box-shadow:inset 1px 1px 3px #555555; -webkit-box-shadow:inset 1px 1px 3px #555555; box-shadow:inset 1px 1px 3px #555555; -moz-border-radius-topleft: 4px; -moz-border-radius-topright:4px; -moz-border-radius-bottomleft:4px; -moz-border-radius-bottomright:4px; -webkit-border-top-left-radius:4px; -webkit-border-top-right-radius:4px; -webkit-border-bottom-left-radius:4px; -webkit-border-bottom-right-radius:4px; border-top-left-radius:4px; border-top-right-radius:4px; border-bottom-left-radius:4px; border-bottom-right-radius:4px; } .sboxin { width: 218px; height: 30px; color: #222222; margin-right: 10px; padding-left: 5px; border: solid 1px #e4dede; -moz-box-shadow:inset 1px 1px 3px #555555; -webkit-box-shadow:inset 1px 1px 3px #555555; box-shadow:inset 1px 1px 3px #555555; -moz-border-radius-topleft: 4px; -moz-border-radius-topright:4px; -moz-border-radius-bottomleft:4px; -moz-border-radius-bottomright:4px; -webkit-border-top-left-radius:4px; -webkit-border-top-right-radius:4px; -webkit-border-bottom-left-radius:4px; -webkit-border-bottom-right-radius:4px; border-top-left-radius:4px; border-top-right-radius:4px; border-bottom-left-radius:4px; border-bottom-right-radius:4px; } .subbot { width: 90px; height: 30px; color: #5b5c57; font-family: 'Raleway', "Helvetica", Arial, sans-serif; font-size: 13px; font-weight: 500; border: solid 1px #d6d6d6; background: url(img/bbot.png) repeat-x; -moz-box-shadow: 0px 0px 2px #dfdfdf; -webkit-box-shadow: 0px 0px 2px #dfdfdf; box-shadow: 0px 0px 2px #dfdfdf; -moz-border-radius-topleft: 4px; -moz-border-radius-topright:4px; -moz-border-radius-bottomleft:4px; -moz-border-radius-bottomright:4px; -webkit-border-top-left-radius:4px; -webkit-border-top-right-radius:4px; -webkit-border-bottom-left-radius:4px; -webkit-border-bottom-right-radius:4px; border-top-left-radius:4px; border-top-right-radius:4px; border-bottom-left-radius:4px; border-bottom-right-radius:4px; } .subbot:hover { cursor: pointer; color: #000; background: url(img/hbbot.png) repeat-x; } .sbot { width: 60px; height: 30px; color: #5b5c57; font-family: 'Raleway', "Helvetica", Arial, sans-serif; font-weight: 500; border: solid 1px #d6d6d6; background: url(img/bbot.png) repeat-x; -moz-box-shadow: 0px 0px 2px #dfdfdf; -webkit-box-shadow: 0px 0px 2px #dfdfdf; box-shadow: 0px 0px 2px #dfdfdf; -moz-border-radius-topleft: 4px; -moz-border-radius-topright:4px; -moz-border-radius-bottomleft:4px; -moz-border-radius-bottomright:4px; -webkit-border-top-left-radius:4px; -webkit-border-top-right-radius:4px; -webkit-border-bottom-left-radius:4px; -webkit-border-bottom-right-radius:4px; border-top-left-radius:4px; border-top-right-radius:4px; border-bottom-left-radius:4px; border-bottom-right-radius:4px; } .sbot:hover { cursor: pointer; color: #000; background: url(img/hbbot.png) repeat-x; } /*------ ## Footer ------*/ #footer { clear: both; background: url(img/bg/bgside.png) repeat; overflow: hidden; -moz-box-shadow:inset 3px 3px 6px #000; -webkit-box-shadow:inset 3px 3px 6px #000; box-shadow:inset 3px 3px 6px #000; } #foot { width: 960px; margin: 0px auto; overflow: hidden; padding-bottom: 20px; } #foot .widget { display: block; margin: 0 10px 1.5em; float: left; } #fback { background: url(img/bg/bgside.png) repeat; width: 270px; height: 20px; float: right; margin-top: -11px; } #fline { width: 100%; height: 20px; } #foot a, #foot a:visited { color: #C20B0B; font-size: 12px; font-weight: 500; } #foot a:hover, #foot a:active { color: #fff; font-weight: 500; } #foot h2 { color: #ffffff; } #colophon { padding-top: 20px; clear: both; } /*-------------------------------------------------------------- # Content --------------------------------------------------------------*/ /*------## Posts and pages---------*/ .sticky { display: block; } .hentry { margin: 0 0 1.5em; } .byline, .updated:not(.published) { display: none; } .single .byline, .group-blog .byline { display: inline; } .page-content, .entry-content, .entry-summary { margin: 1.5em 0 0; } .page-links { clear: both; margin: 0 0 1.5em; } /*------## Page ---------*/ .particle { width: 670px; background: #fff url(img/back.png) repeat-x left top; border: 1px solid #e3e3dc; margin: 20px 0px 30px; padding: 0px; } .ppost { margin-top: 10px; padding: 20px 25px 0px 25px; } .ppost h2 { letter-spacing: -1px; font-size: 22px; } /*------## Single ---------*/ #ssection { clear: both; width: 690px; float: left; margin: 0px; } #ssectionclear { clear: both; padding: 5px 0px; } #aside { width: 270px; float: right; color: #ffffff; padding: 20px 10px; height: 99999px; margin-bottom: -99999px; margin-top: 20px; background: url(img/bg/bgside.png) repeat; -moz-box-shadow:inset 3px 3px 6px #000; -webkit-box-shadow:inset 3px 3px 6px #000; box-shadow:inset 3px 3px 6px #000; } #aside ul { padding-left: 20px; } #aside h2 { color: #C20B0B; } #aside a, #aside a:visited { color: #ffffff; font-weight: 500; } #aside a:hover, #aside a:active { color: #C20B0B; font-weight: 500;} .sarticle { width: 650px; background: #fff url(img/back.png) repeat-x left top; border: 1px solid #e3e3dc; margin: 20px 0px 30px; padding: 10px; } .spost { margin-top: 5px; padding: 10px 25px 0px 25px; overflow: hidden; } .spost h2 { font-size: 17px; } .scat { max-width: 300px; float: right; font-size: 11px; text-align: right; margin-top: -35px; margin-right: -10px; } span.sdate { display: block; width: 35px; height: 40px; color: #676761; font-family: Arial, sans-serif; text-align: center; font-size: 10px; margin-left: -11px; margin-top: -11px; text-transform: uppercase; padding: 0px 1px 4px; border-right: 1px solid #e3e3dc; border-bottom: 1px solid #e3e3dc; background: url(img/bdate.png) repeat-x; -moz-box-shadow: inset 1px 1px 3px #b1b1b1; -webkit-box-shadow: inset 1px 1px 3px #b1b1b1; box-shadow: inset 1px 1px 3px #b1b1b1; } span.sdate strong { display: block; font-size: 18px; margin-top: -9px; } .scom { float: right; margin-right: -11px; margin-top: -40px; line-height: 39px; } .spunta img { position: absolute; width: 9px; height: 30px; margin-top: 4px; margin-left: -6px; } span.scom a, span.scom a:visited { font-size: 18px; font-weight: 600; color: #676761; font-family: Arial, sans-serif; text-align: center; text-decoration: none; margin: 0px; padding: 2px 6px 3px; border: 1px solid #e3e3dc; background: url(img/bcm.png) repeat-x; -moz-box-shadow: inset 1px 1px 3px #b1b1b1; -webkit-box-shadow: inset 1px 1px 3px #b1b1b1; box-shadow: inset 1px 1px 3px #b1b1b1; } span.scom a:hover { color: #111111; } /*------ ## Asides ------*/ .blog .format-aside .entry-title, .archive .format-aside .entry-title { display: none; } /*------ ## Blog ------*/ /* BLOG */ #section { clear: both; width: 690px; float: left; margin: 0px; } #ixaside { width: 270px; float: right; padding: 20px 10px; height: 99999px; margin-bottom: -99999px; margin-top: 20px; background: url(img/bg/bgside.png) repeat; -moz-box-shadow:inset 3px 3px 6px #000; -webkit-box-shadow:inset 3px 3px 6px #000; box-shadow:inset 3px 3px 6px #000; } #ixaside ul { padding-left: 20px;} #ixaside h2 { color: #C20B0B; } #ixaside a, #ixaside a:visited { color: #ffffff; font-weight: 500; } #ixaside a:hover, #ixaside a:active { color: #C20B0B; font-weight: 500;} .article { width: 650px; height: 215px; background: #fff url(img/back.png) repeat-x left top; border: 1px solid #e3e3dc; margin: 20px 0px 20px; padding: 10px; } .bpost { margin-top: 5px; padding: 0px 25px; height: 170px; overflow: hidden; } .bpost h2 { color: #41423C; margin: 1px -10px -3px; letter-spacing: -1px; font-size: 1.3em; text-align: center; text-transform: uppercase; } .bpost p { font-size: 13px; margin: 10px 0px 0px; padding: 0px; } .bmeta { font-size: 10px; } span.bdate { display: block; width: 35px; height: 40px; color: #676761; font-family: Arial, sans-serif; text-align: center; font-size: 10px; margin-left: -11px; margin-top: -11px; text-transform: uppercase; padding: 0px 1px 4px; border-right: 1px solid #e3e3dc; border-bottom: 1px solid #e3e3dc; background: url(img/bdate.png) repeat-x; -moz-box-shadow: inset 1px 1px 3px #b1b1b1; -webkit-box-shadow: inset 1px 1px 3px #b1b1b1; box-shadow: inset 1px 1px 3px #b1b1b1; } span.bdate strong { display: block; font-size: 18px; font-weight: bold; margin-top: -8px; } .bcat { font-size: 12px; } .bcat a { font-weight: 600; color=#111;} .bcom { float: right; margin-right: -11px; margin-top: -45px; line-height: 39px; } .bpunta img { position: absolute; width: 9px; height: 30px; margin-top: 4px; margin-left: -6px; } span.bcom a, span.bcom a:visited { font-size: 18px; font-weight: 600; color: #676761; font-family: Arial, sans-serif; text-align: center; text-decoration: none; padding: 4px 6px; border: 1px solid #e3e3dc; background: url(img/bcm.png) repeat-x; -moz-box-shadow: inset 1px 1px 3px #b1b1b1; -webkit-box-shadow: inset 1px 1px 3px #b1b1b1; box-shadow: inset 1px 1px 3px #b1b1b1; } span.bcom a:hover { color: #111111; } #ixsection { overflow: hidden; margin: 0px 12px 40px; clear: both; padding-top: 30px; } .ixarticle { width: 310px; height: 305px; background: white url(img/back.png) repeat-x left top; border: 1px solid #E3E3DC; margin: 0px -1px -1px 0px; float: left; } .ipost { margin-top: -20px; padding: 5px 30px 0px 30px; height: 260px; overflow: hidden; } .post h2 { margin: 0px -10px 12px 10px; font-size: 16px; } .post p { font-size: 13px; } .meta { font-size: 10px; } span.date { display: block; width: 35px; height: 45px; color: #676761; font-family: Arial, sans-serif; text-align: center; font-size: 10px; margin-left: -1px; margin-top: -1px; text-transform: uppercase; padding: 0px 1px 4px; border-right: 1px solid #e3e3dc; border-bottom: 1px solid #e3e3dc; background: url(img/bdate.png) repeat-x; -moz-box-shadow: inset 1px 1px 3px #b1b1b1; -webkit-box-shadow: inset 1px 1px 3px #b1b1b1; box-shadow: inset 1px 1px 3px #b1b1b1; } span.date strong { display: block; font-size: 18px; font-weight: bold; margin-top: -8px; } span.year { display: block; line-height: 3px; } .com { float: right; margin-right: -1px; margin-top: -14px; line-height: 39px; } .punta img { position: absolute; width: 9px; height: 30px; margin-top: 4px; margin-left: -6px; } span.com a, span.com a:visited { font-size: 18px; font-weight: 600; color: #676761; font-family: Arial, sans-serif; text-align: center; text-decoration: none; margin: 0px; padding: 4px 6px; border: 1px solid #e3e3dc; background: url(img/bcm.png) repeat-x; -moz-box-shadow: inset 1px 1px 3px #b1b1b1; -webkit-box-shadow: inset 1px 1px 3px #b1b1b1; box-shadow: inset 1px 1px 3px #b1b1b1; } span.com a:hover { color: #111111; } #goblog { clear: both; margin: 20px 20px 40px auto; float: right; } #goblog a, #goblog a:visited { padding: 6px 15px; color: #5b5c57; font-size: 12px; font-family: 'Raleway', "Helvetica", Arial, sans-serif; font-weight: 500; border: solid 1px #d6d6d6; background: url(img/bbot.png) repeat-x; -moz-box-shadow: 0px 0px 2px #dfdfdf; -webkit-box-shadow: 0px 0px 2px #dfdfdf; box-shadow: 0px 0px 2px #dfdfdf; -moz-border-radius-topleft: 4px; -moz-border-radius-topright:4px; -moz-border-radius-bottomleft:4px; -moz-border-radius-bottomright:4px; -webkit-border-top-left-radius:4px; -webkit-border-top-right-radius:4px; -webkit-border-bottom-left-radius:4px; -webkit-border-bottom-right-radius:4px; border-top-left-radius:4px; border-top-right-radius:4px; border-bottom-left-radius:4px; border-bottom-right-radius:4px; } #goblog a:hover { cursor: pointer; color: #1f1f1f; background: url(img/hbbot.png) repeat-x; } /*------ ## Comments ------*/ .comment-content a { word-wrap: break-word; } .bypostauthor { display: block; } #coom { width: 650px; display: block; clear: both; overflow: hidden; background: #fff url(img/back.png) repeat-x left top; border: 1px solid #e3e3dc; margin: 30px 0px 50px; padding: 10px; } #coom h3 { font-size: 15px; } #coom span strong { font-size: 12px; } #coom li { list-style: none; border-bottom: dotted 1px #DEDBDB; padding: 30px 20px 30px 0px; } .comm-list { padding-left: 4px; line-height: 130%; } .comm-avatar { width: 40px; float: left; margin: 4px; } .comm-avatar img { border: solid 1px #e2e2db; -moz-box-shadow: 0px 0px 3px #616161; -webkit-box-shadow: 0px 0px 3px #616161; box-shadow: 0px 0px 3px #616161; } .comm-author { margin: 3px 35px; } cite { font-weight: 600; } .comm-meta { font-size: 11px !important; } .comm-entry { padding: 5px 12px; } #coom p {font-size: 13px; font-family: 'Raleway', sans-serif; } #coom form { margin: 10px; } #send { margin: -10px 0px -20px 545px;} #coom input[type="button"], #coom input[type="reset"], #coom input[type="submit"] { height: 30px; color: #5b5c57; cursor: pointer; font-family: 'Raleway', "Helvetica", Arial, sans-serif; font-size: 13px; font-weight: 500; border: solid 1px #d6d6d6; background: url(img/bbot.png) repeat-x; -moz-box-shadow: 0px 0px 2px #dfdfdf; -webkit-box-shadow: 0px 0px 2px #dfdfdf; box-shadow: 0px 0px 2px #dfdfdf; -moz-border-radius-topleft: 4px; -moz-border-radius-topright:4px; -moz-border-radius-bottomleft:4px; -moz-border-radius-bottomright:4px; -webkit-border-top-left-radius:4px; -webkit-border-top-right-radius:4px; -webkit-border-bottom-left-radius:4px; -webkit-border-bottom-right-radius:4px; border-top-left-radius:4px; border-top-right-radius:4px; border-bottom-left-radius:4px; border-bottom-right-radius:4px; } #coom input[type="text"], #coom input[type="email"], #coom input[type="url"] { width: 218px; height: 30px; color: #a0a09a; padding-left: 5px; border: solid 1px #e4dede; background:-webkit-gradient(linear, 0% 84%, 0% 10%, from(#f5f5ec), to(#FFFFFF)); -moz-box-shadow:inset 1px 1px 3px #555555; -webkit-box-shadow:inset 1px 1px 3px #555555; box-shadow:inset 1px 1px 3px #555555; -moz-border-radius-topleft: 4px; -moz-border-radius-topright:4px; -moz-border-radius-bottomleft:4px; -moz-border-radius-bottomright:4px; -webkit-border-top-left-radius:4px; -webkit-border-top-right-radius:4px; -webkit-border-bottom-left-radius:4px; -webkit-border-bottom-right-radius:4px; border-top-left-radius:4px; border-top-right-radius:4px; border-bottom-left-radius:4px; border-bottom-right-radius:4px; } #coom textarea { width: 615px; height: 120px; color: #a0a09a; margin-right: 10px; padding: 5px 0px 0px 5px; border: solid 1px #e4dede; background:-webkit-gradient(linear, 0% 84%, 0% 10%, from(#f5f5ec), to(#FFFFFF)); -moz-box-shadow:inset 1px 1px 3px #555555; -webkit-box-shadow:inset 1px 1px 3px #555555; box-shadow:inset 1px 1px 3px #555555; -moz-border-radius-topleft: 4px; -moz-border-radius-topright:4px; -moz-border-radius-bottomleft:4px; -moz-border-radius-bottomright:4px; -webkit-border-top-left-radius:4px; -webkit-border-top-right-radius:4px; -webkit-border-bottom-left-radius:4px; -webkit-border-bottom-right-radius:4px; border-top-left-radius:4px; border-top-right-radius:4px; border-bottom-left-radius:4px; border-bottom-right-radius:4px; } /*-------------------------------------------------------------- # Media --------------------------------------------------------------*/ .page-content .wp-smiley, .entry-content .wp-smiley, .comment-content .wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } /* Make sure embeds and iframes fit their containers. */ embed, iframe, object { max-width: 100%; } /*----- ## Captions -----*/ .wp-caption { margin-bottom: 1.5em; max-width: 100%; } .wp-caption img[class*="wp-image-"] { display: block; margin-left: auto; margin-right: auto; } .wp-caption .wp-caption-text { margin: 0.8075em 0; } .wp-caption-text { text-align: center; } /*------ ## Galleries -------*/ .gallery { margin-bottom: 1.5em; } .gallery-item { display: inline-block; text-align: center; vertical-align: top; width: 100%; } .gallery-columns-2 .gallery-item { max-width: 50%; } .gallery-columns-3 .gallery-item { max-width: 33.33%; } .gallery-columns-4 .gallery-item { max-width: 25%; } .gallery-columns-5 .gallery-item { max-width: 20%; } .gallery-columns-6 .gallery-item { max-width: 16.66%; } .gallery-columns-7 .gallery-item { max-width: 14.28%; } .gallery-columns-8 .gallery-item { max-width: 12.5%; } .gallery-columns-9 .gallery-item { max-width: 11.11%; } .gallery-caption { display: block; } /*-------------------------------------------------------------- # Media Queries --------------------------------------------------------------*/ /*----- ## 960px - 768px ## -----*/ @media only screen and ( min-width: 768px ) and ( max-width: 960px ) { .pages { width: 730px; } .shadow { width: 100%; } #barra { margin-top: 20px; } #rrss { width: 145px; margin-left: 0px; } #rrss a { padding-right: 2px; padding-left: 2px; } #sub { width: 300px; margin-left: 30px; margin-right: 3px; } .sbox { width: 170px; margin-right: 0px; } .sboxin { width: 190px; margin-right: 0px; } #search { width: 240px; } #search .sf_input { margin-right: 0px; width: 192px; } #ixsection { margin: 65px 2px 40px; padding-top: 20px;} .ixarticle { width: 240px; height: 305px; } #goblog { margin: 20px 20px 40px auto; } #foot { width: 728px; padding-left: 0px; } #by { margin-left: 235px; } #section { width: 460px; } #ixaside { width: 265px; } #ixaside ul { padding-left: 20px;} .article { width: 430px; height: 250px; margin: 20px 0px 0px; } .bpost { height: 230px; } #navigation { margin: 20px 10px 20px 3px; } #ssection { width: 720px; margin-left: 8px; } #aside { display: none;} .sarticle { width: 690px; margin: 20px 0px 0px 0px; } .spost h2 { margin: -5px -15px 10px; } #foot .widget { margin: 20px 50px 20px 30px; float: left; width: 150px; } #coom { width: 690px; } .comments { width: 670px; margin: 20px 0px 20px 0px; } #send { margin-left: 590px; } .particle { width: 710px; margin: 20px 0px 20px 0px; } } /*----- ## max-width: 767px ## -----*/ @media only screen and ( max-width: 767px ) { .pages { width: 485px; } .mainmenu { width: 100% !important; } #logo { padding-left: 0px;} h1 { margin: 3px 30px; } .site-description { padding-left: 35px;} .shadow { display: none; } #barra { margin-top: 25px; } #rrss { width: 153px; margin-left: 10px; } #rrss a { padding-right: 3px; padding-left: 3px; } #sub { width: 300px; margin-left: 10px; margin-right: 0px; } .sbox { width: 190px; margin-right: 5px; } .sboxin { width: 190px; margin-right: 0px; } #search { clear: both; margin-left: 197px; width: 270px; } #search .sf_input { margin-right: 0px; width: 192px; } #ixsection { margin: 100px 4px 20px;} .ixarticle { width: 235px; height: 415px; } .widget_search input[type="search"] { width: 150px; } #goblog { margin: 20px 10px 40px auto; } #foot { width: 480px; } #fback { display: none; } #foot .widget { margin: 20px 10px 20px 50px; float: left; width: 150px; } #section { width: 495px; margin-top: 30px; } #ixaside { display: none; } .ipost { height: 370px; } .article { width: 470px; height: 250px; margin: -1px 0px; } .bpost { height: 230px; } #ssection { width: 495px; margin-left: 4px; margin-top: 10px; } #aside { display: none;} .sarticle { width: 470px; margin: 20px 0px; } .spost { padding: 15px 20px 10px 20px; } .scat { margin: 5px -10px -20px 0px; } #coom { width: 470px; } #coom textarea { width: 100%; } .comments { width: 470px; margin: 20px 0px 20px 0px; } .comm-list li { width: 460px; } #send { margin-left: 370px; } .textbox { width: 440px; } .textboxin { width: 440px; } .particle { width: 470px; margin: 20px 0px; } .ppost { padding: 12px 20px 0px 20px; } } /*----- ## max-width: 500px ## -----*/ @media only screen and ( max-width: 500px ) { .pages { width: 300px; } p { font-size: 14px; line-height: 1.6em; } #backnav { height: 50px } #backheader { height: 130px } #logo h1 a { font-size: 46px; } #logo h1 { margin-top: 20px; } .shadow { display: none; } #barra { overflow: hidden; margin-top: 10px; height: 140px; } #rrss { width: 155px; margin-left: 75px; } #rrss a { padding-right: 3px; padding-left: 3px; } #sub { width: 300px; margin: 10px 0px; } .sbox { width: 185px; margin-right: 5px; } .sboxin { width: 190px; margin-right: 0px; } #search { clear: both; margin-left: 0px; } #search .sf_input { width: 220px; } #ixsection { clear: both; margin: 0px 3px 25px; padding-top: 10px;} .ixarticle { width: 290px; height: 345px; } .ipost { height: 300px; } #goblog { margin: 20px 10px 40px auto; } #foot { width: 300px; } #fback { display: none; } #foot .widget {margin: 30px auto; float: none; width: 70%; } #section { width: 295px; } #ixaside { display: none; } .article { width: 290px; height: 330px; margin: 0px; } .bpost { height: 355px; padding: 0px 15px; } #ssection { width: 295px; margin-left: 4px; } #aside { display: none;} .sarticle { width: 270px; } .spost { padding: 20px 10px 10px 10px; } .spost h2 { margin: -20px 0px -5px; } #coom { width: 270px; } #coom textarea { width: 96%; } #coom ol { padding: 0px 0px 10px 20px;} #coom li {padding-top: 20px;} .comments { width: 270px; margin: 20px 0px 20px 0px; } .comm-list li { width: 260px; } #send { margin-left: 180px; } .particle { width: 290px; margin: 20px 0px 30px; } .ppost { padding: 20px 10px 0px 10px; } .ppost h2 { margin: -5px -10px 10px; } }