/*
Theme Name: Simply Delicious v.responsive
Theme URI: http://jaimepascual.com
Description: Free blog theme based on mmminimal.com
Author: JaimePascual
Author URI: http://jaimepascual.com
.
Design by Derek Clark and Coding by Rob Hope representing ThemeCobra
.
*/

body.login {background: none repeat scroll 0% 0% rgb(255, 255, 255) !important;}

html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}del,ins{text-decoration:none;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:baseline;}sub{vertical-align:baseline;}legend{color:#000;}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}input,button,textarea,select{*font-size:100%;}
html, ul, li{margin:0px;padding:0px;}
body{font-family:Georgia, Arial;font-size:1.25em;letter-spacing:-0.1px;line-height:23px;padding:0;margin:0em 0em 0em 1em;}
a{text-decoration:none;}
a:hover{text-decoration:none;}
a img{border:none;}
img.alignright{padding:0 0 20px 30px;float:right;}
img.alignleft{padding:0 30px 20px 0;float:left;}
.post-single .entry .aligncenter{clear:both;display:block;margin-left:auto;margin-right:auto;}
.relative{position:relative}
p{margin-bottom:20px;letter-spacing:-0.1px;}
b, strong{font-weight:bold;}
.clear{clear:both;}
h1{font-size:24px;margin:0 0 20px 0;line-height:24px;}
h2{font-size:16px;margin:0 0 15px 0;line-height:16px;font-weight:bold;}
h3{font-size:14px;margin:0 0 10px 0;line-height:14px;font-weight:normal;}
h4, h5, h6{margin:0 0 10px 0;}
blockquote{color:#828795;font-family:Palatino Linotype, Book Antiqua3, Palatino, Arial;font-size:24px;letter-spacing:-0.1px;font-style:italic;line-height:24px;padding:0 0 0 20px;margin:40px 0 40px 20px;border-left:1px dotted #828795;}
ol, ul{margin:0 0 20px 25px;}
ol li{list-style-type:decimal;padding:0 0 10px 0;}
ul li{list-style-type:circle;padding:0 0 5px 5px;}
i, em{font-style:italic}
hr{border:none;border-bottom:1px dotted #cfd2dc;margin:20px 0;}
del{text-decoration:line-through;}
#contenido{width:640px;margin:0 auto;padding:30px 0 5px 0;}
#container{width:640px;margin:0 auto;padding:0 0 35px 0;}
#header{text-align:center;margin:40px 0 0 0;}
#logo{margin-bottom:33px;}
#logo h1{font-family:Droid Serif, arial, serif;font-style:italic;font-weight:normal;margin:0 0 10px 0;font-size:70px;letter-spacing:-0.40px}
.slogan{font-style:italic;font-size:23px;margin:35px 0 0 0;}
#navigation{margin:0 0 34px 0;padding:0;z-index:30;}
#navigation li{position:relative;margin:0;padding:0;list-style:none;display:inline-block;text-transform:uppercase;font-size:12px;}
#navigation li a{display:block;margin:0;padding:0px 15px;font-weight:normal;font-size:16px;}
#navigation li a:hover{border:none;}
#navigation li ul{position:absolute;left:-12px;visibility:hidden;margin:10px 0 0 0;padding:20px;background:url('./img/dropdown.png')top left;border:none;z-index:1000;}
#navigation li ul li{float:none;display:inline;}
#navigation li ul li a{position:relative;display:block;margin:0;font-size:13px;text-transform:none;font-style:italic;padding:5px 3px;width:auto;white-space:nowrap;text-align:left;text-decoration:none;color:#ccc;border:none;border-bottom:1px dotted #666;font-size:16px;}
#navigation li ul li a:hover{color:#FFF;border:none;border-bottom:1px dotted #666;}
#navigation li ul ul, #navigation li ul ul{display:none;}
#content{}
#icons{width:640px;height:26px;margin:10px 0 20px 0;text-align:center;}
#icons a{margin:0 4px;opacity:0.5;}
#icons a:hover{opacity:1;}
#footer{height:15px;margin:40px 0 20px 0;padding-bottom: 60px;text-align:center;font-size:16px;clear:both;}
#featured{margin:0 0 40px 0;padding:0;border:none;border-bottom:1px #828795 dotted;}
#featured img{max-width:640px;margin:3px 0 10px 0;height:auto;}
#featured h3{float:left;font-size:25px;}
#featured .featured-cat{float:right;font-size:25px;}
#featured .featured-cat a{}
#featured .featured-cat a:hover{color:#8d8f98;}
#featured .featured-info{clear:both;margin:20px 0 20px 0;font-style:italic;}
#posts img{position:absolute;border:0;}
#posts{width:672px;font-size:12px;line-height:16px;}
#posts .post{width:190px;height:120px;display:inline-block;margin:0 31px 80px 0;padding:0;vertical-align:top;}
#posts .post-thumb{width:190px;height:120px;padding:0;position:relative;overflow:hidden;margin:0;}
#posts .post-thumb .caption{display:block;width:190px;height:120px;background:url('./../../uploads/2013/01/post-ver.png');position:absolute;display:none;cursor:pointer;}
#posts .post-thumb .caption a{display:block;width:190px;height:120px;}
#posts .post-info{display:block;width:190px;text-align:center;margin:0 0 30px 0;}
#posts .post-info h3{margin:10px 0 5px 0;font-size:16px;line-height:16px;}
#posts .post-category a{font-size:17px;line-height:16px;}
#posts .post-category a:hover{text-decoration:none;}
#browsing{width:640px;border:none;border-top:1px #828795 dotted;padding-top:10px;margin:10px 0 0 0;font-style:italic;font-size:18px;}
#browsing a{}
#browsing a:hover{text-decoration:none;}
#browsing .browse-nav{width:640px;}
#browsing .browse-left{float:left;width:20%;text-align:left;}
#browsing .browse-mid{float:left;width:60%;text-align:center;}
#browsing .browse-right{float:left;width:20%;text-align:right;}
#browsing .pagenavi{margin:0 0 20px 0;padding:5px 1px 5px;float:left;width:98%;}
#browsing .pagenavi a{padding:4px 6px;text-decoration:none;}
#browsing .pagenavi span.pages{padding:4px 6px;font-weight:bold;}
#browsing .pagenavi span.current{padding:4px 6px;font-weight:bold;}
#browsing .pagenavi span.expand{padding:4px 6px;}
#content h1{font-family:Droid Serif, arial, serif;font-style:italic;font-weight:normal;letter-spacing:-0.25}
.post-page{padding:0 0 0 0;border-bottom:1px #828795 dotted;margin:0 0 40px 0;}
.post-single{padding:0 0 20px 0;}
.post-featured-image{margin-bottom:10px;}
.post-single-details{height:14px;margin:0 0 20px 0;}
.cat, .date{display:inline;}
.twitter-share-button{float:right;height:10px;margin:0 -14px 0 0; display:none;}
.post-single .entry{padding:0 0 15px 0;margin:0 0 20px 0;border-bottom:1px #CCC dotted;}
.post-single .entry img{max-width:640px;height:auto;margin:0 0 5px 0;}
.post-single .entry .wp-caption-text{font-size:11px;text-align:center;margin:-5px 0 20px 0;padding:0;height:20px;max-width:650px;}
.tags a, .custom-links a, .custom-title a{border:none;}
.tags a{text-transform:lowercase;}
h3.maylike{margin:0 0 20px 0;}
.prevPagi a, .nextPagi a{background:url('./img/pagi-arrows.png') left top no-repeat;position:fixed;top:50%;width:60px;height:60px;text-indent:-1000em;outline:none;}
.prevPagi a{left:30px;}
.prevPagi a:hover{background-position:0 -60px;}
.nextPagi a{background-position:-60px 0;right:30px;}
.nextPagi a:hover{background-position:-60px -60px;}
#comments{border:none;margin:0 0 0 0;line-height:1.2em;}
#comments h2{font-size:14px;line-height:14px;margin:0 0 20px 0;font-weight:normal;}
#commentary{border-top:1px #828795 dotted;padding:20px 0 0 0;}
#commentary .comment{margin:20px 0 0 0;padding:0;}
#commentary .comment-text{width:600px;padding:20px 20px 5px 20px;border-top:1px solid #e7e8ed;background:#f8f9fe;font-style:italic;}
#commentary .comment-author{text-align:right;display:block;width:640px;font-size:14px;padding:10px 0 0 0;margin:0 0 2px 0;background:url('./img/comment-arrow.gif') right top no-repeat;}
#commentary .comment-date{text-align:right;display:block;width:640px;font-size:11px;}
#leave-comment{margin:20px 0;border-top:1px #828795 dotted;padding:20px 0 0 0;}
#leave-comment input, textarea{padding:15px;border:none;border-top:1px solid #e7e8ed;background:#ebeeff;color:#8d8f98;font-style:italic;}
#leave-comment input{width:170px;margin:0 0 20px 0;}
#leave-comment textarea{width:610px;}
#leave-comment label{font-size:10px;color:#999;}
#leave-comment .comment-field{width:200px;float:left;margin:0 20px 0 0;}
#leave-comment .website{margin-right:0;}
#leave-comment .comment-field-message{margin:0;}
#leave-comment #submit{float:right;width:112px;height:28px;padding:0;border:none;cursor:pointer;}
#leave-comment .comment-subscribe{width:450px;float:left;}
.OD5{color:#ff0033}
#textorojo li a{color:#ff0000;}
#navigation li a.textorojo{color:#ff0000;}
p.aleatoria{font-size:1.7em;color: #898D9A;padding-bottom: 20px;}
a:hover .aleatoria {text-decoration:underline;color:#000;}

/*------no mostrar publicidad de google search-------*/
div.gsc-adBlock {display:none;}
div.gsc-adBlockVertical {display:none;}
.comment-awaiting-moderation{display:none;}

/*------------------Barra lateral-------------------------------------*/
div#secondary.widget-area{margin:30px 0 30px 0;padding:5px;}
li#ctc-3.widget.ctc{border:dashed 4px #707070;-moz-border-radius: 13px;-webkit-border-radius: 13px;border-radius: 13px;padding:5px;margin-top:45px;}

/*------------------Esconder etiquetas html en comentarios-------------------------------------*/
p.form-allowed-tags{display:none;}
/* ---------------------------------Responsive-------------------------------------------- */

/*1 Column for Narrow Browser Windows (between 0 and 679 pixels) and Smartphones in both orientations. In this query we linearize all of the columns so that they stack vertically by setting float to none and width to auto. We also use this query to move the menu to the top of the layout and stack its links neatly in a vertical orientation. */
@media only screen and (min-width: 0px) and (max-width: 679px) {

}

/*Exception rules for Smartphones in Landscape orientation only. When a smartphone is turned sideways, the text will appear larger so this query contains a single rule that reduces the font-size.*/
@media only screen and (max-device-width: 480px) and (orientation : landscape) {

}

/*2 Column with top spanning menu for Medium Browser Windows and Portrait Tablets Ipad (Si vale porque el ipad es hasta 768px en portait). In this query we move the navigation to the top and stack the links. The sidebar and main content areas remain as columns. The interior 3-column structure inside the main content column is reflowed so that the third column drops below the first 2 and spans their width.*/
@media only screen and (min-width: 680px) and (max-width: 979px) and (orientation : portrait) {

}

/* Ipad Landscape */

@media (max-device-width: 1024px) and (orientation: landscape) { 
 
}

/* Para monitores de ordenador */
@media screen and (min-width: 1036px) {
#contenido{width:max-content;margin:0 auto;padding:30px 0 5px 0;}
#container {float:left;width:640px;margin: 0px;}
#comentynube {float:right;width:350px;}
#posts {width: 105%;}
#posts {width: 105%;}
.post-page{width: 900px;padding-left:40px;}
#comentynube .post{padding-left:80px}
}
div.mensaje{text-align: center;padding-bottom: 40px;color: rgb(57, 136, 32);}

/* =====================================================================
   RESPONSIVE (añadido)
   Todo lo de abajo solo afecta a pantallas de menos de 740px, o a
   pantallas táctiles. En ordenador el diseño es exactamente el original.
   ===================================================================== */

/* Táctiles: la miniatura entera es un enlace (no hay "hover") */
@media (hover: none) {
  #posts .post-thumb .caption { display: block !important; opacity: 0; }
}

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

  html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
  body { margin: 0; }

  /* --- Estructura: de anchos fijos a fluidos --- */
  #contenido { width: auto; max-width: 640px; margin: 0 auto; padding: 20px 15px 5px; box-sizing: content-box; }
  #container { width: auto; float: none; margin: 0; padding-bottom: 20px; }
  #comentynube { float: none; width: auto; }
  #content { overflow-wrap: break-word; word-wrap: break-word; }

  img, iframe, video, embed, object { max-width: 100%; }
  img { height: auto; }

  /* --- Cabecera --- */
  #header { margin-top: 10px; }
  #logo { margin-bottom: 25px; }
  #logo h1 { font-size: min(70px, 10vw); line-height: 1.15; margin-bottom: 10px; }
  #logo h1 img { max-width: 100%; height: auto; }
  .slogan { font-size: 20px; line-height: 1.3; margin-top: 20px; }

  /* --- Menú: el desplegable pasa a ocupar el ancho del menú --- */
  #navigation { position: relative; margin-bottom: 25px; }
  #navigation li { position: static; }
  #navigation li a { padding: 6px 10px; }
  #navigation li ul { left: 0; right: 0; margin: 6px 0 0; padding: 10px 20px; text-align: center;
                      background: rgba(0, 0, 0, 0.8); border-radius: 6px; max-height: 60vh; overflow-y: auto; }
  #navigation li ul li a { white-space: normal; padding: 9px 3px; }

  /* --- Rejilla de miniaturas (3 columnas, como en ordenador) --- */
  #posts { width: auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 4.5%; }
  #posts .post { width: auto; height: auto; display: block; margin: 0 0 10px; }
  #posts .post-thumb { width: 100%; height: auto; aspect-ratio: 190 / 120; }
  #posts img { width: 100%; height: 100%; max-width: none; object-fit: cover; }
  #posts .post-thumb .caption,
  #posts .post-thumb .caption a { width: 100%; height: 100%; }
  #posts .post-thumb .caption { background-size: 100% 100%; }
  #posts .post-info { width: auto; margin-bottom: 20px; }
  #posts .post-info h3 { overflow-wrap: break-word; word-wrap: break-word; }
  #posts #browsing,
  #posts h3.maylike { grid-column: 1 / -1; }

  /* --- Paginación --- */
  #browsing, #browsing .browse-nav { width: auto; }

  /* --- Entrada destacada (portada) --- */
  #featured { margin-bottom: 30px; }
  #featured img { max-width: 100%; height: auto; }
  #featured h3, #featured .featured-cat { font-size: 22px; }

  /* --- Entrada individual --- */
  #content h1 { line-height: 1.15; }
  .post-featured-image img,
  .post-single .entry img { max-width: 100%; height: auto; }
  .post-single-details { height: auto; line-height: 1.5; }
  .post-single .entry .wp-caption,
  .post-single .entry .wp-caption-text { max-width: 100%; }
  .post-single .entry .wp-caption-text { height: auto; min-height: 20px; }
  .entry pre { overflow-x: auto; }
  .entry table { display: block; max-width: 100%; overflow-x: auto; }
  blockquote { margin: 30px 0 30px 5px; }

  /* Flechas anterior/siguiente: de "fijas sobre la foto" a una fila bajo la entrada */
  .prevPagi { float: left; }
  .nextPagi { float: right; }
  .prevPagi a, .nextPagi a { position: relative; top: auto; left: auto; right: auto; display: block; }

  /* --- Comentarios --- */
  #comments { clear: both; overflow-wrap: break-word; word-wrap: break-word; }
  #commentary .comment-text, #commentary .comment-author, #commentary .comment-date { width: auto; }
  #respond textarea,
  #respond input[type="text"],
  #respond input[type="email"],
  #respond input[type="url"] { width: 100%; max-width: 100%; box-sizing: border-box; }

  /* --- Páginas (información, 404...) --- */
  .post-page { width: auto; padding-left: 0; }

  /* --- Pie --- */
  #icons { width: auto; height: auto; }
  #footer { height: auto; margin-top: 30px; padding-bottom: 30px; font-size: 15px; line-height: 1.5; }
}

/* Móviles en vertical: 2 columnas de miniaturas */
@media screen and (max-width: 519px) {
  #posts { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 5%; }
  #posts .post-info h3 { font-size: 15px; line-height: 1.2; }
  #posts .post-category a { font-size: 15px; }
  #featured h3, #featured .featured-cat { float: none; }
  #featured .featured-cat { margin-bottom: 5px; }
  img.alignleft, img.alignright { float: none; display: block; margin: 0 auto 15px; padding: 0; }
}