@charset "UTF-8";
/*
Theme Name: Fronda
Theme URI: http://underscores.me/
Author: Pablo Dominguez
Author URI: http://astroweb.me/
Description: Custom theme for Fronda A.C..
Version: 2.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: fronda
Tags:

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.

Fronda 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: ---------------------------------------------------------------- 1. Normalize 2. Responsive Grid System 3. Typography 4. Elements 5. Forms 6. Accessibility 7. Alignments 8. Clearings 9. Header 10. Navigation 10.1. Links 10.2. Menus 11. Widgets 12. Content 12.1. Posts and pages 12.2. Projects 12.3. Asides 12.4. Comments 13. Footer 14. Infinite scroll 15 Media 15.1. Captions 15.2. Galleries --------------------------------------------------------------*/
/*--------------------------------------------------------------
1. Normalize
--------------------------------------------------------------*/
html { font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

body { margin: 0; }

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; }

h1 { font-size: 2em; margin: 0.67em 0; }

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; }

button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; }

button { overflow: visible; }

button, select { text-transform: none; }

button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; }

button[disabled], html input[disabled] { cursor: default; }

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

input { line-height: normal; }

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; }

input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }

input[type="search"] { -webkit-appearance: textfield; box-sizing: content-box; }

input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

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; }

/*--------------------------------------------------------------
2. Responsive Grid System
--------------------------------------------------------------*/
/*  SECTIONS  */
.section { position: relative; clear: both; padding: 0px; margin: 0px; }

.section:focus { outline: none; }

/*  COLUMN SETUP  */
.col { display: block; position: relative; float: left; margin: 0%; }

.col.offset_1 { margin-left: 8.3333%; }

.col.offset_2 { margin-left: 16.66%; }

.col.offset_3 { margin-left: 25%; }

/*  GROUPING  */
.group { zoom: 1; /* For IE 6/7 */ }

.group:before, .group:after { content: ""; display: table; }

.group:after { clear: both; }

/*  GRID OF TWELVE  */
.span_12_of_12 { width: 100%; }

.span_11_of_12 { width: 91.66%; }

.span_10_of_12 { width: 83.33%; }

.span_9_of_12 { width: 75%; }

.span_8_of_12 { width: 66.66%; }

.span_7_of_12 { width: 58.33%; }

.span_6_of_12 { width: 50%; }

.span_5_of_12 { width: 41.66%; }

.span_4_of_12 { width: 33.33%; }

.span_3_of_12 { width: 25%; }

.span_2_of_12 { width: 16.66%; }

.span_1_of_12 { width: 8.333%; }

/*  GO FULL WIDTH BELOW 480 PIXELS */
@media screen and (max-width: 480px) { .span_1_of_12, .span_2_of_12, .span_3_of_12, .span_4_of_12, .span_5_of_12, .span_6_of_12, .span_7_of_12, .span_8_of_12, .span_9_of_12, .span_10_of_12, .span_11_of_12, .span_12_of_12 { width: 100%; }
  .col.offset_1, .col.offset_2, .col.offset_3 { margin-left: 0; } }

/*--------------------------------------------------------------
3. Typography
--------------------------------------------------------------*/
body, button, input, select, textarea { color: #000; font-family: "Rubik", sans-serif; font-size: 16px; font-size: 2.8vh; line-height: 1.5; }

@media screen and (max-width: 480px) { body, button, input, select, textarea { font-size: 16px; font-size: 1rem; } }

h1, h2, h3, h4, h5, h6, .site-title { clear: both; margin: 0; line-height: 1; font-weight: 700; }

h1, .site-title { font-size: 24px; font-size: 4.2vh; }

@media screen and (max-width: 480px) { h1, .site-title { font-size: 24px; font-size: 1.5rem; } }

h2 { font-size: 20.8px; font-size: 3.64vh; margin-bottom: 4vh; }

@media screen and (max-width: 480px) { h2 { font-size: 20.8px; font-size: 1.3rem; } }

@media screen and (max-width: 480px) { h2 { margin-bottom: 20px; } }

.post h2 { font-size: 16px; font-size: 2.8vh; margin: 0; }

@media screen and (max-width: 480px) { .post h2 { font-size: 16px; font-size: 1rem; } }

p { margin-top: 0; margin-bottom: 4vh; }

@media screen and (max-width: 480px) { p { margin-bottom: 20px; } }

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: 2.625vh; line-height: 1.6; margin-bottom: 1.6em; max-width: 100%; overflow: auto; padding: 1.6em; }

@media screen and (max-width: 480px) { pre { font-size: 15px; font-size: 0.9375rem; } }

code, kbd, tt, var { font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; font-size: 15px; font-size: 2.625vh; }

@media screen and (max-width: 480px) { code, kbd, tt, var { 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%; }

/*--------------------------------------------------------------
4. Elements
--------------------------------------------------------------*/
html { box-sizing: border-box; }

*, *:before, *:after { /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */ box-sizing: inherit; }

body { height: 100%; width: 100%; background: #fff; /* Fallback for when there is no custom background color defined. */ }

.home.page .site { height: 100vh; overflow: hidden; }

.container { position: relative; width: 78vw; margin: 0 auto; }

blockquote, q { quotes: "" ""; }

blockquote:before, blockquote:after, q:before, q:after { content: ""; }

hr { background-color: #555; border: 0; height: 1px; margin-bottom: 1.5em; }

ul, ol { margin: 0 0 1.5em 3em; }

ul { list-style: disc; }

ol { list-style: decimal; }

li > ul, li > ol { margin-bottom: 0; margin-left: 1.5em; }

dt { font-weight: bold; }

dd { margin: 0 1.5em 1.5em; }

img { height: auto; /* Make sure images are scaled correctly. */ max-width: 100%; /* Adhere to container width. */ }

table { margin: 0 0 1.5em; width: 100%; }

.astro-popup { color: #fff; }

.astro-popup a, .astro-popup a:visited   { color: #555 !important; }

.astro-popup a:hover { color: #fff !important; }

.astro-popup .background { background-color: rgba(255, 255, 255, 0.8); }

.astro-popup .message { width: 62.4vw; padding: 5vh 5vw; left: 18.8vw; overflow: visible; }

.astro-popup .close { top: 6vh; right: 6vw; z-index: 9999; }

.astro-popup .close:before, .astro-popup .close:after { background-color: #fff; width: 5vh !important; }

.astro-popup#boletin { right: -100%; left: auto; }

.astro-popup#boletin.active { left: auto; right: 0; }

@media screen and (max-width: 480px) { .astro-popup .message { left: 5vw; width: 90vw; padding: 30px 5vw; background-color: rgba(0, 0, 0, 0.5); }
  .astro-popup#boletin .message { padding-top: 100px; } }

@media screen and (max-width: 480px) { .message .inc_optin_2 .wpoi-form .wpoi-subscribe-send { position: relative !important; bottom: auto !important; right: auto !important; } }

/*--------------------------------------------------------------
5. Forms
--------------------------------------------------------------*/
button, input[type="button"], input[type="reset"], input[type="submit"] { border: 1px solid; border-color: #ccc #ccc #bbb; border-radius: 3px; background: #e6e6e6; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), inset 0 15px 17px rgba(255, 255, 255, 0.5), inset 0 -5px 12px rgba(0, 0, 0, 0.05); color: rgba(0, 0, 0, 0.8); font-size: 12px; font-size: 2.1vh; line-height: 1; padding: .6em 1em .4em; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); }

@media screen and (max-width: 480px) { button, input[type="button"], input[type="reset"], input[type="submit"] { font-size: 12px; font-size: 0.75rem; } }

button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover { border-color: #ccc #bbb #aaa; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), inset 0 15px 17px rgba(255, 255, 255, 0.8), inset 0 -5px 12px rgba(0, 0, 0, 0.02); }

button:active, button:focus, input[type="button"]:active, input[type="button"]:focus, input[type="reset"]:active, input[type="reset"]:focus, input[type="submit"]:active, input[type="submit"]:focus { border-color: #aaa #bbb #bbb; box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.5), inset 0 2px 5px rgba(0, 0, 0, 0.15); }

input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea { color: #666; border: 1px solid #ccc; border-radius: 3px; }

input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="number"]:focus, input[type="tel"]:focus, input[type="range"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="time"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="color"]:focus, textarea:focus { color: #111; }

select { border: 1px solid #ccc; }

input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"] { padding: 3px; }

textarea { padding-left: 3px; width: 100%; }

/*--------------------------------------------------------------
6. 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: 2.45vh; 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. */ }

@media screen and (max-width: 480px) { .screen-reader-text:focus { font-size: 14px; font-size: 0.875rem; } }

/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus { outline: 0; }

/*--------------------------------------------------------------
7. 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; }

/*--------------------------------------------------------------
8. 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; table-layout: fixed; }

.clear:after, .entry-content:after, .comment-content:after, .site-header:after, .site-content:after, .site-footer:after { clear: both; }

/*--------------------------------------------------------------
9. Header
--------------------------------------------------------------*/
.site-header { position: absolute; top: 0; left: 11vw; height: 11vh; background-color: #000; color: #fff; z-index: 9000; }

.site-header a, .site-header a:visited { color: #fff; }

.site-header a:hover { color: #aaa; }

@media screen and (max-width: 480px) { .site-header { position: fixed; left: 0; width: 100%; height: 100px; } }

.site-branding { position: absolute; top: 1.5vh; left: 3vh; height: 8vh; z-index: 9000; }

.site-branding .site-description { margin: 0; font-size: 12.8px; font-size: 2.24vh; }

@media screen and (max-width: 480px) { .site-branding .site-description { font-size: 12.8px; font-size: 0.8rem; } }

.site-branding .custom-logo-link, .site-branding .custom-logo { display: block; position: relative; height: 100%; width: auto; }

@media screen and (max-width: 480px) { .site-branding { top: 10px; left: 20px; height: 80px; } }

@media screen and (max-width: 320px) { .site-branding { display: block; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); height: auto; width: 50vw; }
  .site-branding .custom-logo-link, .site-branding .custom-logo { height: auto; width: 100%; } }

.site-banner { position: relative; height: 100vh; background-color: #fff; }

.site-banner .soliloquy-outer-container { position: absolute; top: 0; left: 0; height: 100%; width: 100%; }

.site-banner .soliloquy-outer-container .soliloquy-viewport, .site-banner .soliloquy-outer-container .soliloquy-item, .site-banner .soliloquy-outer-container .soliloquy-link { height: 100vh !important; width: 100% !important; overflow: hidden; }

.site-banner .soliloquy-outer-container .soliloquy-image { position: absolute; height: 100% !important; width: 100%; -o-object-fit: cover; object-fit: cover; }

.site-banner .soliloquy-outer-container .soliloquy-prev, .site-banner .soliloquy-outer-container .soliloquy-next { background: none; }

.site-banner .soliloquy-outer-container .soliloquy-prev span, .site-banner .soliloquy-outer-container .soliloquy-next span { display: block; height: 80%; width: 80%; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }

.site-banner .soliloquy-outer-container .soliloquy-prev { left: 5vw; }

.site-banner .soliloquy-outer-container .soliloquy-prev span { border-top: 4px solid #000; border-left: 4px solid #000; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }

.site-banner .soliloquy-outer-container .soliloquy-prev:hover span { border-top-color: #555; border-left-color: #555; }

.site-banner .soliloquy-outer-container .soliloquy-next { right: 5vw; }

.site-banner .soliloquy-outer-container .soliloquy-next span { border-top: 4px solid #000; border-right: 4px solid #000; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

.site-banner .soliloquy-outer-container .soliloquy-next:hover span { border-top-color: #555; border-right-color: #555; }

@media screen and (max-width: 480px) { .site-banner .soliloquy-outer-container { top: 100px; }
  .site-banner .soliloquy-outer-container .soliloquy-image { display: block; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); height: 80% !important; margin-top: -50px; }
  .site-banner .soliloquy-outer-container .soliloquy-controls { display: none !important; } }

/*--------------------------------------------------------------
10. Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
a { color: #000; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; text-decoration: none; }

a:visited { color: #000; }

a:hover, a:focus, a:active { color: #555; }

a:focus { outline: thin dotted; }

a:hover, a:active { outline: 0; }

/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/
.main-navigation { content: ""; display: table; table-layout: fixed; position: absolute; top: 0; right: 0; height: 100%; width: 100%; z-index: 8000; /*.blog & { > ul { right: ( ( 100vw - $width__site-main ) * 0.5 ); } }*/ }

.main-navigation ul { display: block; list-style: none; margin: 0; padding-left: 0; }

.main-navigation ul ul { position: absolute; top: 100%; left: 0; width: 100%; padding-top: 3.5vh; z-index: 99999; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }

.main-navigation ul ul li { margin: 1px 0; width: 36.5vh; background-color: #000; }

.main-navigation ul ul a { text-transform: none; font-weight: 400; }

.main-navigation ul li:hover > ul, .main-navigation ul li.focus > ul { opacity: 1; visibility: visible; }

.main-navigation li { float: left; position: relative; padding: 0 2vh; }

.main-navigation li:last-child { padding-right: 0; }

.main-navigation a { display: block; text-decoration: none; text-transform: uppercase; font-weight: 700; }

.main-navigation > ul { display: block; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); right: 3vh; }

.menu-toggle { display: none; position: fixed; top: 25px; right: 30px; height: 50px; width: 50px; box-shadow: none; border: none; box-shadow: none; background-color: transparent; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; z-index: 9999; }

.menu-toggle:hover, .menu-toggle:focus { box-shadow: none; background-color: transparent; outline: none; }

.menu-toggle .menu-icon { display: block; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); height: 5px; width: 100%; background-color: #fff; will-change: transform; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }

.menu-toggle .menu-icon:before, .menu-toggle .menu-icon:after { content: ''; display: block; position: absolute; height: 100%; width: 100%; will-change: transform; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; background-color: #fff; }

.menu-toggle .menu-icon:before { top: -15px; }

.menu-toggle .menu-icon:after { bottom: -15px; }

.main-navigation.toggled .menu-icon { background: none; }

.main-navigation.toggled .menu-icon:before { top: 0; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

.main-navigation.toggled .menu-icon:after { bottom: 0; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }

@media screen and (max-width: 480px) { .menu-toggle { display: block; }
  .main-navigation > ul { position: fixed; top: 100px; right: -100%; height: 100vh; width: 100vw; overflow-y: scroll; padding-bottom: 100px; -webkit-transform: none; transform: none; background-color: #000; border-top: 1px solid #fff; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
  .main-navigation > ul > li { width: 100%; padding: 20px; box-shadow: none; border-bottom: 1px solid #fff; }
  .main-navigation > ul > li:hover { box-shadow: none; }
  .main-navigation > ul ul { position: relative; top: 0; padding-top: 10px; opacity: 1; visibility: visible; }
  .main-navigation > ul ul li { padding: 10px 0; }
  .main-navigation.toggled > ul { right: 0; } }

.site-main .comment-navigation { margin: 0 0 1.5em; overflow: hidden; }

.comment-navigation .nav-previous { float: left; width: 50%; }

.comment-navigation .nav-next { float: right; text-align: right; width: 50%; }

.posts-navigation { display: block; position: relative; float: left; clear: both; height: auto; width: auto; margin: 3vh 0 5vh; text-align: center; white-space: nowrap; overflow: hidden; color: #aaa; }

.posts-navigation span, .posts-navigation a { display: inline-block; float: left; height: auto; width: 2vw; padding: 7px 0; margin-right: 0.5vw; text-align: center; border: 2px solid #aaa; font-size: 16px; font-size: 2.8vh; line-height: 1; text-decoration: none; }

@media screen and (max-width: 480px) { .posts-navigation span, .posts-navigation a { font-size: 16px; font-size: 1rem; } }

.archive .posts-navigation span, .archive .posts-navigation a { width: auto; padding: 7px; margin-bottom: 5px; }

.posts-navigation a, .posts-navigation a:visited { color: #aaa; }

.posts-navigation a:hover { color: #000; border-color: #000; }

@media screen and (max-width: 480px) { .posts-navigation { margin: 15px 0 25px; }
  .posts-navigation span, .posts-navigation a { width: 30px; margin-right: 5px; } }

.single-post .post-navigation { position: relative; margin-top: 10vh; margin-left: 6vw; }

.single-post .post-navigation .nav-next, .single-post .post-navigation .nav-previous { position: absolute; top: 0; left: 0; height: 4vh; width: 4vh; }

.single-post .post-navigation .nav-next:before, .single-post .post-navigation .nav-previous:before { content: ''; display: block; position: absolute; top: 15%; left: 15%; height: 70%; width: 70%; border-top: 3px solid #000; border-left: 3px solid #000; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }

.single-post .post-navigation .nav-next a, .single-post .post-navigation .nav-previous a { content: ''; display: block; position: absolute; top: 0; left: 0; padding-top: 5vh; text-align: left; color: #555; opacity: 0; }

.single-post .post-navigation .nav-next:hover:before, .single-post .post-navigation .nav-previous:hover:before { border-color: #555; }

.single-post .post-navigation .nav-next:hover a, .single-post .post-navigation .nav-previous:hover a { opacity: 1; }

.single-post .post-navigation .nav-previous { left: 5vh; z-index: 100; }

.single-post .post-navigation .nav-previous:before { border-left: none; border-right: 3px solid #000; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

@media screen and (max-width: 480px) { .single-post .post-navigation { position: relative; margin-top: 10px; margin-bottom: 60px; }
  .single-post .post-navigation .nav-next, .single-post .post-navigation .nav-previous { position: relative; float: right; left: 0; height: 20px; width: 20px; }
  .single-post .post-navigation .nav-next a, .single-post .post-navigation .nav-previous a { position: relative; padding-top: 20px; opacity: 1; }
  .single-post .post-navigation .nav-next { margin-right: 50px; } }

/*--------------------------------------------------------------
11. Widgets
--------------------------------------------------------------*/
.widget { margin: 0 0 5vh; /* Make sure select elements fit in widgets. */ }

.widget select { max-width: 100%; }

/*--------------------------------------------------------------
12. Content
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/
.sticky { display: block; }

.hentry { margin: 0; }

.byline, .updated:not(.published) { display: none; }

.single .byline, .group-blog .byline { display: inline; }

.page-content, .entry-content, .entry-summary { margin: 0; }

.page-links { clear: both; margin: 0 0 1.5em; }

/* ==================== FRONDA ==================== */
#fronda { padding-bottom: 0; }

#fronda .col { padding: 0 5vw; }

@media screen and (max-width: 480px) { .page.fronda .page-content { padding-top: 100px; } }

/* ==================== BLOG ==================== */
.blog .site, .archive .site { width: 78vw; margin-left: 11vw; margin-top: 14vh; }

@media screen and (max-width: 480px) { .blog .site, .archive .site { margin-top: 120px; } }

.blog .post, .archive .post, .recent-posts .post { height: 55vh; margin-bottom: 1vw; overflow: hidden; }

.blog .post:nth-child(4n+2), .archive .post:nth-child(4n+2), .recent-posts .post:nth-child(4n+2) { padding-right: 0.75vw; }

.blog .post:nth-child(4n+3), .archive .post:nth-child(4n+3), .recent-posts .post:nth-child(4n+3) { padding-left: 0.25vw; padding-right: 0.5vw; }

.blog .post:nth-child(4n+4), .archive .post:nth-child(4n+4), .recent-posts .post:nth-child(4n+4) { padding-left: 0.5vw; padding-right: 0.25vw; }

.blog .post:nth-child(4n+5), .archive .post:nth-child(4n+5), .recent-posts .post:nth-child(4n+5) { padding-left: 0.75vw; }

.blog .post .post-link, .archive .post .post-link, .recent-posts .post .post-link { display: block; position: relative; height: 100%; width: 100%; background-color: #fcfcfc; border: 2px solid transparent; font-size: 12.8px; font-size: 2.24vh; }

@media screen and (max-width: 480px) { .blog .post .post-link, .archive .post .post-link, .recent-posts .post .post-link { font-size: 12.8px; font-size: 0.8rem; } }

.blog .post .post-link p, .archive .post .post-link p, .recent-posts .post .post-link p { margin: 0; padding: 0 3vh; }

.blog .post .post-link:hover, .archive .post .post-link:hover, .recent-posts .post .post-link:hover { border-color: #000; }

.blog .post .post-link:hover h2, .blog .post .post-link:hover p, .archive .post .post-link:hover h2, .archive .post .post-link:hover p, .recent-posts .post .post-link:hover h2, .recent-posts .post .post-link:hover p { color: #000; }

.blog .post .thumbnail-container, .archive .post .thumbnail-container, .recent-posts .post .thumbnail-container { display: block; position: relative; height: 25vh; width: 100%; overflow: hidden; }

.blog .post .thumbnail-container img, .archive .post .thumbnail-container img, .recent-posts .post .thumbnail-container img { display: block; position: absolute; height: 25vh; width: 100%; -o-object-fit: cover; object-fit: cover; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }

.blog .post h2.entry-title, .archive .post h2.entry-title, .recent-posts .post h2.entry-title { display: block; height: 11vh; width: 100%; padding: 3vh; padding-bottom: 0; overflow: hidden; }

.blog .post .entry-meta, .archive .post .entry-meta, .recent-posts .post .entry-meta { position: absolute; bottom: 0; left: 0; width: 100%; padding: 3vh; color: #555; }

@media screen and (max-width: 480px) { .blog .post, .archive .post, .recent-posts .post { height: 400px; margin-bottom: 20px; padding: 0 !important; }
  .blog .post .thumbnail-link, .archive .post .thumbnail-link, .recent-posts .post .thumbnail-link { height: 100px; }
  .blog .post h2.entry-title, .archive .post h2.entry-title, .recent-posts .post h2.entry-title { padding: 20px; } }

.single .site { margin-top: 22vh; }

.single .entry-meta { font-size: 12.8px; font-size: 2.24vh; color: #aaa; padding-top: 9vh; padding-right: 6vh; }

@media screen and (max-width: 480px) { .single .entry-meta { font-size: 12.8px; font-size: 0.8rem; } }

.single .entry-content { height: auto; }

.single .entry-footer { margin-bottom: 5vh; }

@media screen and (max-width: 480px) { .single .site { margin-top: 150px; }
  .single article { margin-top: 20px; }
  .single .entry-meta { padding: 0; }
  .single .entry-footer { margin-bottom: 25px; } }

.tiled-gallery { margin-top: 20px !important; }

/*--------------------------------------------------------------
## Asides
--------------------------------------------------------------*/
.blog .format-aside .entry-title, .archive .format-aside .entry-title { display: none; }

/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/
.comments-area { margin-top: 3vh; padding: 3vh; border: 1px solid #aaa; }

.comment-content a { word-wrap: break-word; }

.bypostauthor { display: block; }

/*--------------------------------------------------------------
13. Footer
--------------------------------------------------------------*/
.site-footer { padding-bottom: 5vh; }

.site-footer .col { padding: 0 5vw; }

@media screen and (max-width: 480px) { .site-footer { padding-bottom: 25px; } }

.social-links { text-align: left; font-size: 32px; font-size: 5.6vh; }

@media screen and (max-width: 480px) { .social-links { font-size: 32px; font-size: 2rem; } }

.social-links .jetpack-social-navigation ul { margin: 0; }

.social-links .jetpack-social-navigation li { margin-right: 1vw; }

.social-links .jetpack-social-navigation li:last-child { margin: 0; }

.recent-posts { padding: 10vh 0; background-color: #efefef; }

@media screen and (max-width: 480px) { .recent-posts { padding: 50px 0; } }

/*--------------------------------------------------------------
14. Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation, .infinite-scroll.neverending .site-footer { /* Theme Footer (when set to scrolling) */ display: none; }

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer { display: block; }

/*--------------------------------------------------------------
15. 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; }