/*
Theme Name: Mokka Blogs Child COCINA Y RECETAS
Theme URI: //www.favethemes.com/
Author: Favethemes
Author URI: //www.favethemes.com/
Description: Mokka is a responsive, minimalist, flexible and modern WordPress Blog. From a clean white color scheme (with a accent color of choice) & multiple page layouts which all remain sophisticated and simple. Everything definitely brings a certain elegance.
Version: 1.0
Tags: white, right-sidebar, left-sidebar, fluid-layout, custom-colors, custom-menu, featured-images, post-formats, theme-options, translation-ready
License: GNU General Public License version 3.0
License URI: //www.gnu.org/licenses/gpl-3.0.html
Text Domain: favethemes
Template: mokka
*/


@import url("../mokka/style.css");

@font-face {
  font-family: "line-icons";
  src:url("//www.himgs.com/css/hola/fonts/line-icons/line-icons.eot");
  src:url("//www.himgs.com/css/hola/fonts/line-icons/.eot?#iefix") format("embedded-opentype"),
    url("//www.himgs.com/css/hola/fonts/line-icons/line-icons.woff") format("woff"),
    url("//www.himgs.com/css/hola/fonts/line-icons/line-icons.ttf") format("truetype"),
    url("//www.himgs.com/css/hola/fonts/line-icons/line-icons.svg#line-icons") format("svg");
  font-weight: normal;
  font-style: normal;

}


* {
	box-sizing: border-box;
}
*::selection {
    background: #548f08;
}

#div-hola-slot-megabanner, #div-hola-slot-robapaginas, #div-hola-slot-robainferior, #div-hola-slot-bannerinferior{
	display:table !important;
	margin: 0.5em auto;
	text-align:center;
}

body [data-icon]:before {
  font-family: "line-icons" !important;
}

body [class^="icon-"],
body [class*=" icon-"] {
  display: inline;
}

body [class^="icon-"]:before,
body [class*=" icon-"]:before {
  font-family: "line-icons" !important;
}
*::selection {
    background: #548f08 !important;
}

.blogs2015 [data-icon]:before {
    font-family: "hola" !important;
  }
.entry h1 {
    margin-top: 1em;
}
.entry h2 {
    margin-top: 1em;
}
.entry h3 {
    margin-top: 1em;
}  
.entry p {
    margin-bottom: 1em;
}


.post-pagination [class^="icon-"]:before, [class*=" icon-"]:before {
	font-family: "line-icons" !important;
}

.icon-arrows-01 {
	font-family: "line-icons" !important;
}


.share-wrapper [data-icon]:before{
	font-family: "hola" !important;
}
a {
    color: #548f08;
}   
a.comment-reply-link {
   color: #548f08;
} 
p.logged-in-as a {
    color: #548f08;
}

input[type="text"] {
    box-shadow: 0 0 0 1px #dbdbdb;
}
img {
	height: auto;
}

  
/* Centrar publi */
#showHere {
	max-width: 100%;
    display: table;
    margin: 0 auto;
    overflow: hidden;
    margin-bottom: 10px;
}
/* margen para cuando sale megabanner*/
.container {
    margin-top: 10px !important;
}

/* margen inferior cuando sale la publi en el sidebar*/
.ad-visible {
    margin-bottom: 20px;
}

/*


/* Header -------------------------------------- */
.header {
margin-bottom: 1.5em;
}
.adskin .header-container {
	width: 77% !important;
}

.hola-skin .header-container {
	max-width: 1150px;
  padding: 0 10px;
}

.hola-skin .container.header-container .logo{
	border-bottom: 0;
	width: 41%;
	background-color:#548f08;
	left: initial;
}

.hola-skin .container.header-container .logo img {
    max-height: 100px;
    margin: 0 auto;
    display: block;
}

.hola-skin .container.header-container .cabecera {
	border-bottom: 0;
}

.hola-skin .container.header-container .cabecera img {
    height: 100px;
}

.header-container {
	margin-bottom: 1em;
	/* border-top: 0px solid black;
    border-bottom: 2px solid black;*/
}
.container {
    max-width: 1240px;
    padding: 0;
    position: relative;
}


.header-container .logo {
	position: absolute;
	left: 0px;
	border-bottom: 1px #ccc solid;
	}
.cabecera {
	float: right;
	border-bottom: 1px #ccc solid;
} 

.navbar .primary-nav {
    min-height: 0px;
    border-top: 0px solid #FFFFFF !important; 
    border-bottom: 0px solid #FFFFFF !important;
}



/* Colors ---------------------------------------------------------------------------- */  
.continue-reading:hover, a:hover img, .latest-tweet-widget a:hover {
	opacity: 1;
}
.text-center .archive-title {
    color: #548f08;
}

/* Main Menu (removed) ---------------------------------------------------------------------------- */  
.secondary-nav, #pageslide li .nav-sub-wrap a {
    display: none !important;
}
.navbar.yamm {
    display: none;
}

/* icon behind image -------------------------------------- */ 
.single-post .icon-wrapper {
    display: none;
}
.post-meta [class^="icon-"]:before,
.post-meta [class*=" icon-"]:before {
  font-family: "line-icons" !important;
 }	
 
 i.icon.icon-office-56.icon-x2 {
    display: initial;
}
i.icon.icon-chat-messages-03 {
    display: initial;
}

/* imagen destacada en post -------------------------------------- */ 

.featured-image a {
    text-align: center;
}
.featured-image img {
    width: 100%;
    }
    
.featured-image a:hover img {
    opacity: 1;
}
.widget a.carousel-prev:hover, .widget a.carousel-next:hover, .post a.carousel-prev:hover, .post a.carousel-next:hover, .secondary-nav .dropdown-menu>li>a:hover, .image-post-menu:hover, .featured-image a:hover, .gallery-icon a:hover {
    background: #FFFFFF !important;
    background-color: rgb(255, 255, 255) !important;
}
.post-content .entry {
    font-size: 1em;
}


/* Sidebar ----------------------------------------------------------------------------- */   
.sidebar {
  border-top: 0px solid #000;
  padding-top: 0px;
}
.bordered-sidebar {
  border: 0px solid #000;
}
.centre{
text-align: center !important;
}
.centre .grande img {
	max-width: 100%;
}
.centre .mediano img {
	max-width: 60%;	
}
.centre .peque img {
	max-width: 40%;
}
ul, ol {
    list-style-type: none;
}
.widget {
  text-align: left;
  border-bottom: 1px dashed #000;

}
.widget-title {
	font-size: 2.5em;
    color: #548f08; 
    text-transform: none;
}
.widget_recent_entries li:before, .widget_recent_comments li:before {
    content: counter(count);
    counter-increment: count;
    position: absolute;
    top: 33%;
    left: 0;
    margin-top: -25px;
    opacity: 1;
    font: italic 36px/1 serif;
    color: #548f08 !important;
}
.post-banner h2.post-banner-title {
    font-weight: bold;
}
.widget_recent_comments .url {
    letter-spacing: 0em;
}

.aboutme {
	width: 80%;
    display: table;
    margin: 0 auto;
}



/*latest post in sidebar ----------------------------------------------------------------------------- */  
.inner-widget .colored-bg.inline-block, .author-image {
    display: none;
}
.widget .latest-posts {
    margin-bottom: 0px !important;
}
.latest-posts h4 {
	margin-bottom: 0px !important;
	font-size: 16px;
}
.latest-posts p {
display: none;
}



/* Listado todos los blogs ----------------------------------------------------------------------------- */  
.btn-blog {
	width: 80%;
	margin-top: 10px;
}
.btn-blog:hover, .btn-blog:focus, .btn-blog:active, .btn-blog.active, .open .dropdown-toggle.btn-blog {
    width: 80%;
    margin-top: 10px;
}

.btn-danger:hover {
    color: #fff !important;
    background-color: #548f08;
    border-color: #548f08;
}
.btn-danger {
    color: #fff !important;
    background-color: #548f08;
    border-color: #548f08;
}

.navbar-form .form-control {
	width: 300px;
	}
.form-control {
    padding: 10px 30px;
    }



/* Main Titles ----------------------------------------------------------------------------- */  

 .composer-title {
   color: #548f08;
}

.latestposts-composer-title-wrapper {
  margin-top: 10px;
  margin-bottom: 30px;
}

/* Compartir Redes Sociales ---------------------------------------------------------------- */
.share-wrapper.icon {
    top: 5px;
    left: 2px;
}
.share-wrapper {
    margin-bottom: 20px;
    padding: 30px 0 10px 0;
}
.share-wrapper ul li a {
    border-radius: 10%;
    border: 1px solid #FFFFFF;
    color: #FFFFFF;
    text-indent: -1px;
    padding: 15px 0;
    font-size: 30px;
    display: inline-block;
    width: 70px;
    height: 70px;
    text-align: center;
   }
.share-title {
    font-size: 24px;
}   
a.facebook {
    background-color: #45619d;
}
a.twitter {
    background-color: #55acee;
}
a.pinterest {
    background-color: #d11e16;
}
a.google-plus {
    background-color: #da4835;
}
a.tumblr {
    background-color: #36465d;
}
a.whatsapp {
	 background-color: #1d9d10;
}




.list-inline .icon-chat-messages-03 {
	top: 3px;
}



/* Posts  General -------------------------------------------------------------------- */  
.post-content {
    border-bottom: none;
}

.post-title {
    margin: 10px 0 10px;
}
.post-meta a {
    color: #548f08;
}

.post-meta-date, .post-meta-tag {
    margin-bottom: 0px;
}

.home .post-meta-tag{
	display:none;
}

.post-meta-category {
    display: none !important;
}
  .single-post .post-tags {
    display: none;
}



/* comentarios -------------------------------------------------------------------- */  
.comments-wrapper .row {
	  margin-left: -15px;
}
.logged-in-as a {
    font-weight: 400;
}

.logged-in-as a:hover, a:focus {
    color: #000000;
    text-decoration: none;
    font-weight: 400;
}
.continue-reading {
    font-style: normal;
     font: normal 14px 'Almelo', Arial, Verdana, sans-serif !important;
}
.post-content {
    margin: 0 0 10px;
}
.post-author-wrapper {
    display: none;
}
/* Oculta el campo "web" al escribir un comentario*/
#url {
	display: none;
}



/* Paginación -------------------------------------------------------------------- */  
.pagination>li:first-child>a, .pagination>li:first-child>span {
    border-radius: 10%;
   }
.icon-arrows-02:before {
    content: "r";
}
.pagination>li:last-child>a, .pagination>li:last-child>span {
    border-radius: 10%;
 }
 .icon-arrows-01:before {
    content: "s";
}






/* Related Posts  -------------------------------------------------------------------- */  

.related-posts-wrapper {
    padding-bottom: 0px;
    margin-bottom: 30px;
}
.related-post .featured-image img {
    min-height: auto;
    min-width: auto;
}



/* imágenes por ratio 
.post-content .featured-image{
    height: 0;
    width: 100%;
    padding-bottom: 77%;
}

.related-post .featured-image {
    height: 0;
    width: 100%;
    padding-bottom: 75%;
}
*/


/*.single-post .featured-image {
   }*/

/* ======================================================================== */
/* ======================================================================== */
/* ======================================================================== */
/* ======================================================================== */
/* ======================================================================== */
/* ======================================================================== */
/* ============================ MEDIA QUERIES ============================= */
/* ======================================================================== */
/* ======================================================================== */
/* ======================================================================== */
/* ======================================================================== */
/* ======================================================================== */
/* ======================================================================== */




@media (min-width: 1300px) {
/* con portería */

.adskin .header-container .cabecera img {
    height: 100px !important;
}

.adskin .header-container .logo img {
	height: 100px !important;
}

}

@media (min-width: 1400px) {


/* con portería */
.adskin .header-container .cabecera img {
    height: 110px !important;
}
.adskin .header-container .logo img {
	height: 110px !important;
}
}

@media (min-width: 1500px) {

/* con portería */
.adskin .header-container .cabecera img {
    height: 125px !important;
}
.adskin .header-container .logo img {
	height: 125px !important;
}
	}
	
@media (min-width: 1500px) {
.adskin .post-content .featured-image {
    height: 415px !important;
}
	}	

/* ! Large desktop
/* ======================================================================== */
/* ======================================================================== */
/* ======================================================================== */
/* ======================================================================== */


@media (min-width: 1200px) {
  
.banner-container-grid div[class*="col-"] img {   
  height: 497px;
}
img {
  max-width: 100%;
}
.container .logo img { 
	height: 125px; 
	 } 
.container .cabecera img {
	height: 125px;  
 }
	
.related-post .featured-image img {
    min-height: auto;
    }
.related-post .post-title {
    font-size: 20px;
}

/* con portería */
.adskin .header-container .cabecera img {
    height: 96px;
}

.adskin .header-container .logo img {
	height: 96px;
}
}

/* ! Medium desktop
/* ======================================================================== */
/* ======================================================================== */
/* ======================================================================== */
/* ======================================================================== */
@media (max-width: 1199px) {
.col-contenido {
	width: calc(100% - 330px) !important;
}
.col-barra-derecha {
	width: 330px !important;
	float: left;
}
.header-container .cabecera img {
    height: 114px;
}
.header-container .logo img {
	height: 114px;
}
h2, .h2 {
    line-height: 35px;
}
.related-post .featured-image img {
    min-height: auto;
    }
.related-post .post-title {
    font-size: 20px;
}


/* con portería */
.adskin .header-container .cabecera img {
    height: 95px;
}
.adskin .header-container .logo img {
	height: 95px;
}
.adskin .port-content .featured-image {
    height: 294px;
}
}



@media (max-width: 1081px) {



.header-container .cabecera img {
    height: 103px;
}
.header-container .logo img {
	height: 103px;
}
	
.related-post .post-title {
    font-size: 20px;
}

/* con portería */
.adskin .featured-image {
    height: 239px;
}
.adskin .header-container .cabecera img { /*solucionar problema - no cuadran media quieries con cortes de bootstrap hidden-ms */
    height: 85px;
}
.adskin .header-container .logo img {
	height: 85px;
}
}


@media (max-width: 1023px) {  /* CAMBIO DE CABECERA. A PARTIR DE AQUÍ ES AL 100% Y ARRIBA COMUNIDAD (logo) Y ABAJO BLOG (cabecera)  */
	

div#div-hola-slot-robapaginas{ /*margen publi*/
	margin-bottom: 20px;
}

.header-container {
	width: 100% !important;
}
.header-container .logo {
    position: relative !important;
    width: 100% !important;
    text-align: center;
    background-color: #548f08;
}
.header-container .cabecera {
    position: relative !important;
    width: 100% !important;
    height: 100%;
    }
.header-container .logo img {
	height: auto;
}    
.header-container .cabecera img {  
	 width: 100%;
	 height: 100%;
	 }
.related-post .featured-image img {
    min-height: auto;
    }
.related-post .post-title {
    font-size: 20px;
}
.post-meta {
	display: none;
}
.visible-xs, .visible-sm {
    display: initial !important;
}

/* con portería */

.adskin .header-container .cabecera img { 
	height: auto;
}

.adskin .header-container .logo img {
	height: auto;
}

}


/* ! Mini Desktop
/* ======================================================================== */
/* ======================================================================== */
/* ======================================================================== */
/* ======================================================================== */

@media (max-width: 991px) {
body {
	display: block !important;
}	
#canvas {
    max-width: 100%;
}
.header-container {
	width: 100% !important;
}
.col-contenido {
	width: 100% !important;
}
.col-barra-derecha {
	width: 100% !important;
}


/* con portería */

.adskin .header-container .cabecera img {
    height: auto;
}
.adskin .header-container .logo img {
	height: auto;
}

}




@media (max-width: 800px) {

.post-banner-content {
    height: 118px;
    }
.aboutme {
    width: 50%;
    display: table;
    margin: 0 auto;
}
.col-sm-12, .col-xs-12 {
    width: 100% !important;
}
.post-meta.visible-sm li {
    border-right: 1px solid #000;
    margin-right: -3px;
    padding: 0 10px;
    line-height: 14px;
}
pagination-wrapper .col-lg-10.col-lg-offset-2.col-md-10.col-md-offset-2.col-sm-10.col-sm-offset-2 {
    width: 100% !important;
}  /*ñapa para centrar la paginación aquí*/
	}



/* ! Landscape phone to portrait tablet
/* ======================================================================== */
/* ======================================================================== */
/* ======================================================================== */
/* ======================================================================== */
@media (max-width: 769px) {

.col-md-8 {
    width: 100% !important;
}	
.col-md-4 {
    width: 100% !important;
}
.header-container {
	width: 100% !important;
}
.header-container  .logo img {  
	 width: 50%;
} 
.form-group {
    width: 100%;
}
.comments-wrapper img.avatar {
  display: none;
}
.comment-content {
    margin: 23px 0 0 0px;
}
.reply {
    margin: 0 0 0 0px;
}
.related-post .post-title {
    font-size: 20px;
} 


/* con portería */
.adskin .header-container {
    width: 100% !important;
}
}



@media (max-width: 579px) {

.col-md-10.col-sm-12.quitar-padding {
    padding-left: 0px;
    padding-right: 0px;
}
 .post-content .entry {
    font-size: 1.1em;
}
}


/* ! Landscape phones and down
/* ======================================================================== */
/* ======================================================================== */
/* ======================================================================== */
/* ======================================================================== */
@media (max-width: 480px) {

#canvas {
    max-width: 100%;
}	
.container {
    width: 90% !important;
}
.header-container {
	width: 100% !important;
}
.container .logo-wrap {
    height: 86px !important;
    border-bottom: 1px solid #000000 !important;
}	
.logo-wrap {
    margin-bottom: 10px !important;
	}
h1, .h1 {
    line-height: initial !important;
}
.aboutme {
    width: 80%;
    margin-left: 10%;
}

h2 {
    font-size: 25px;
    line-height: 30px;
}
.share-wrapper {
    padding: 25px 45px 12px 45px;
}
}


@media (max-width: 410px) {
h1.post-title {
    font-size: 32px;
    }
.share-wrapper {
    padding: 25px 15px 12px 15px;
}

}


@media (max-width: 320px) {

.col-xs-12 {
	padding-left: 0 !important;
    padding-right: 0 !important;
}

.share-wrapper {
    padding: 20px 0 0px 0;
}  
.aboutme {
    width: 100%;
    margin-left: 0;
} 

/* con portería */

.adskin .col-xs-12 {
	padding-left: 0 !important;
    padding-right: 0 !important;
}
}
