* {
margin: 0;
padding: 0;
}

:root {
--black: #11181c;
--blue: #0277bd;
--yellow: #F4C83A;
--white: #fff;
	--bg: #f4f6fb;
      --card: #ffffff;
      --muted: #7a7f8c;
      --accent: #3b82f6;
      --text: #121826;
      --border: #e3e7f0;
}

html{min-height:101%;}

body {
font: 370 15px/1.8 "Sans", serif;
margin: 0;
padding: 0;
	 background: radial-gradient(circle at 10% 20%, rgba(59, 130, 246, 0.07), transparent 25%),
                  radial-gradient(circle at 90% 10%, rgba(16, 185, 129, 0.06), transparent 23%),
                  linear-gradient(180deg, #fdfdfd 0%, #f5f7fb 100%);
	color: var(--black);
	 min-height: 100vh;

}

li {
list-style: none;
}
a {
color: var(--blue);
text-decoration: none;
}
a:hover {
opacity: 0.7;
}

a[target="_blank"]:after {
font-family: "Material Light";
content: "\f8ce";
font-weight: 200 !important;
position: relative;
line-height: 1;
}
.more{padding:20px 0; font-size:.9em; float:left;}

strong,
b {
font-weight: 600;
}

figcaption {
font-size: 0.8em;
margin: 5px 0;
}

header{float:right;  width:320px; margin:0px; position:fixed;     
top: 40px;
left:calc(50% + 400px);
padding: 0px;
border-radius: 18px;
background:#FFF;
	border: 1px solid var(--border);
float:left;
	  box-shadow: 0 8px 30px rgba(17, 24, 39, 0.08);
      transition: transform 0.2s ease, box-shadow 0.2s ease;}


.short_bio{ padding:0 20px 20px;width: calc(100% - 40px);
border-bottom:1px solid var(--border);}

nav{float:left; padding:20px;width:100%;}

nav li a{
float: left;
color: var(--black);
padding:0;
margin:0 0 5px 0;
width: 50%;

}

nav li a:hover {

transition:.5s;
}

.current_page_item{opacity:.6;}


.list li {
line-height: 2.5;
width: 100%;
float: left;
border-bottom: 1px solid #eee;
}

.list li a{
color: var(--black);
}

.active {
opacity: 0.6;
}

nav a {
text-decoration: none;
border: none;
}

#searchform{width:100%; float:left;}

.searchbox{border:none; border-bottom:1px solid #EEE;  font: 400 18px/2 "Sans", serif;
width:100%; float:left;}

input:focus{
outline: none;
}

h1 {
font: 700 .9em/1 "Sans Bold", sans-serif;
width: calc(100% - 40px);
float: left;
margin: 10px 0;
text-align: left;
text-transform:uppercase;
align-self: center;
padding:0 20px;
}

h1 span{float:left; width:100%;  font: 500 .8em/2 "Sans", sans-serif; margin:0; text-transform:none;}
h1 a {
text-decoration: none;
color:var(--black);
}

h2 {
font: 600 3em / 1 "Sans Bold", sans-serif;
float: left;
width: 100%;
margin: 40px 0;
}

h3 {
width: 100%;
font: 500 1.3em/2.5 "Sans Bold", sans-serif;
text-align: left;
margin:0;
float: left;
}


h3 a{color:var(--black);}

h4 {
float: left;
font: 400 1em / 2.5 "Sans", sans-serif;
float
}

h5 {
width: 100%;
font: 700 0.8em / 1 "Sans Bold", sans-serif;
text-align: left;
margin: 0 0px 40px 0;
float: left;
text-transform: uppercase;
position: relative;
}

h5:before {
border-top: 2px solid #f5f5f5;
content: "";
margin: 0 auto;
position: absolute;
top: 5px;
left: 0;
right: 0;
bottom: 0;
width: 100%;
z-index: -1;
}

h5 span {
background: #fff;
padding: 0 10px 0 0;
}

h5 span:before h6 {
width: 100%;
font: 600 0.7em / 1 "Sans", sans-serif;
text-align: center;
margin: 0 0 15px;
float: left;
padding: 5px 0 0 0;
}

h6{  width: 100%;
font: 600 0.7em / 1 "Sans", sans-serif;
text-transform:uppercase;
margin: 0 0 15px;
float: left;
padding: 5px 0 0 0;}

.excerpt {
color: #616161;
float: right;
font-family: "sans";
}



body.category-quotes h4{display:none;}
body.category-quotes .excerpt{float:left;}

em {
--mark-color: #f8db75;
--mark-skew: 0.25em;
--mark-height: 1em;
--mark-overlap: 0.3em;

margin-inline: calc(var(--mark-overlap) * -1);
padding-inline: var(--mark-overlap);

background-color: transparent;
background-image: linear-gradient(
to bottom right,
transparent 50%,
var(--mark-color) 50%
),
linear-gradient(var(--mark-color), var(--mark-color)),
linear-gradient(to top left, transparent 50%, var(--mark-color) 50%);
background-size: var(--mark-skew) var(--mark-height),
calc(100% - var(--mark-skew) * 2 + 1px) var(--mark-height),
var(--mark-skew) var(--mark-height);
background-position: left center, center, right center;
background-repeat: no-repeat;
color: inherit;
}

figure {
float: left;
width: 100%;
}
section {
width:100%;
z-index: 10;
padding: 0 0 100px;
margin: 40px auto 0;	
float: left;


}

p{float:left; width:100%; margin:0 0 10px;}

article {
margin: 0;
width: 720px;
border: 1px solid var(--border);
margin: 0px calc(50% - 400px) 40px;
padding:20px;
border-radius: 18px;
background:#FFF;
float:left;
	  box-shadow: 0 8px 30px rgba(17, 24, 39, 0.08);
      transition: transform 0.2s ease, box-shadow 0.2s ease;
}


.category-cloud{float:left; width:100%;}


.pictures{	grid-column-start: 2;
grid-column-end: 4;}

.topics{	  display: grid;	grid-column-start: 1;
grid-column-end: 4;}


.lists{	grid-column-start:0;
grid-column-end: 1;}

.lists li {
float: left;
width: 100%;
line-height: 2;
border-bottom: 1px solid #eee;
}

.cat-link{
float:left; width:32%;
margin:0 1.3333% 0 0;
line-height: 2;
border-bottom: 1px solid #eee;}


.attachment-post-thumbnail {
max-width: 100px;
border-radius: 10px;
float: left;
}



.profile {
background: url("https://carlosrodrigo.com/wp-content/uploads/2025/10/profile_250.jpg");
margin: 50px calc(50% - 125px) 60px;
border-radius: 65% 50% 60% 45%;
width: 250px;
height: 250px;
display: block;
float:left;
}

.line {
width: 100%;
float: left;
margin: 50px 0;
background: url(https://carlosrodrigo.com/wp-content/uploads/2025/10/line.png);
height: 10px;
}

.quote{grid-column-start: 2;
grid-column-end: 4;}

.quote p {
font: 300 1.2em/2 "Serif", serif;
text-align: center;
float: left;
margin: 0;
width: 100%;
}

footer {
width: calc(100% - 40px);
margin: 0;
float: left;
font: 400 .8em/2 "Sans", serif;
padding: 20px;
border-top:1px solid var(--border);

}

.top::after {
font-family: "Material Light";
content: "\e5d8";
font-weight: 200 !important;
position: relative;
line-height: 1;
}

.list li {
float: left;
margin: 0 40px 0 0;
}

.sq {
font-size: 0.8em;
float: left;
border-radius: 4px;
border: 1px solid #b0bec5;
color: var(--blue);
margin: 2px 2px 0 0;
padding: 5px;
min-width: 2px;
height: 17px;
text-align: center;
line-height: 1;
font-family: Sans;
}

.alive {
background: #1e88e514;
}

.familia,
.mar,
.trabajo,
.viaje,
.casa {
background: #eee;
}

.tya {
border: 1px solid #f48359;
}

.meta {
float: left;
width: 100%;
font: 400 .8em/1 "Sans", serif;
padding: 0px 0 20px;
opacity:.7;
}

ul,
ol {
float: left;
width: 100%;
}

ul p,
ol p {
margin-bottom: 0;
}
ul > li {
list-style: none;
}
ol > li {
list-style: decimal;
margin-left: 20px;
width: calc(100% - 20px);
}
ul ol,
ul ul,
ol ul,
ol ol {
margin-bottom: 0;
}

.col-2 li {
width: 50%;
float: left;
}

li{line-height:1.8;}

code {
font-family:"Courier New"; background:#EEEEEE90; padding:20px;
font-size: .9em;
float:left; width:calc(100% - 40px);
}
pre {
margin: 3rem 0;
background: var(--color-black);
color: var(--color-white);
padding: 1.5rem;
overflow-x: scroll;
overflow-y: hidden;
line-height: 1.5rem;
}
pre code {
padding: 0;
background: none;
color: inherit;
}

blockquote {
float: left;
margin: 20px 0;
}

figcaption {
padding-top: 0.75rem;
color: var(--color-text-grey);
}

hr {
margin: 40px calc(100% - 40px) 40px 0;
width: 40px;
float: left;
border: none;
height: 2px;
background: var(--yellow);
opacity: 0.7;
}

.img-caption,
.video-caption {
padding-top: 0.75rem;
line-height: 1.5em;
}

@media screen and (max-width: 480px) {
body {
--padding: 3rem;
}

article {
float: left;
width: 100%;
margin: 0 0px 40px;
}

h3.home {
font-size: 1.2em;
margin: 40px 0;
}

.content h3 {
line-height: 1.5;
}

section,
.single,
footer {
width: 90%;
float: left;
margin: 40px 5%;
padding: 0;
}

h2{width:100% float:left; text-align:center;}

.posts > *
{width:100%; margin:0;}

.excerpt{float:left; width:100%;}

footer{padding:0 0 40px;}

nav {
width: 90%;
float: left;
padding:0; margin:10px 5%;
}
}

@font-face {
font-family: "Serif";
src: url("/fonts/serif_light.otf");
}

@font-face {
font-family: "Material Light";
src: url("/fonts/MaterialSymbolsOutlined-Light.ttf");
}

@font-face {
font-family: "Sans Bold";
src: url("/fonts/PPFramaText-Bold.woff2");
}

@font-face {
font-family: "Sans";
src: url("/fonts/PPFramaText-Regular.woff2");
}