@charset "UTF-8";



:root {
  --yellow:#FEA621;
  --brown:#B6573C;
  --brown-with-opacity:#b6573c99;
  --light-brown:#E9AD92;
  --cyan:#134F50;
  --green:#9BBF44;
  --grey:#808080;
  --pink:#f6ece9;
  --font-base:'Montserrat', sans-serif;
  --font-heading:'Allura', serif;
    --woocommerce:#a46497;
  --wc-green:#7ad03a;
  --wc-red:#a00;
  --wc-orange:#ffba00;
  --wc-blue:#2ea2cc;
  --wc-primary:#a46497;
  --wc-primary-text:white;
  --wc-secondary:#ebe9eb;
  --wc-secondary-text:#515151;
  --wc-highlight:#77a464;
  --wc-highligh-text:white;
  --wc-content-bg:#fff;
  --wc-subtext:#767676
  }


.scr-text{border:0;clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);
  clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;
  width:1px;word-wrap:normal !important;word-break:normal}
.scr-text:focus {background-color:#f1f1f1;border-radius:3px;box-shadow:0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip:auto !important;-webkit-clip-path:none;clip-path:none;color:#21759b;display:block;
  font-size:0.875rem;font-weight:700;height:auto;right:5px;line-height:normal;
  padding:15px 23px 14px;text-decoration:none;top:5px;width:auto;z-index:100000}  

.user_like{background-color:transparent;padding:5px;text-decoration:none;color:blue;font-size:1.5rem}
.user_like:hover{text-decoration:none}

.mpme-recipe-tags{margin:30px 0;display:flex;flex-wrap:wrap;gap:10px}
.mpme-recipe-tags a{padding:10px 12px;color:#333;text-decoration:none;
    background:#ecedef;
    border-radius:16px;
    text-align:center;
    width:auto;
    text-transform:lowercase;
    font-size:12px;margin-right:10px;flex-shrink:0}


.mpme-cooking-info{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:20px}
.mpme-cooking-info p{padding:0;margin:0}
.mpme-cooking-info p span{font-weight:600}

.mpme-site-inner{width:clamp(90%,85%,80%);margin:0 auto;padding:20px 0}
.mpme-site-inner h2,
.mpme-recipe h2{
    font-family:'Roboto', sans-serif;
    font-weight:bold;
    text-transform:uppercase;
    font-size:1.7rem;
    color:#000;
    margin-top:1.1em;
    line-height:20px;
    padding-bottom:10px;
}

.mpme-modal .mpme-editor-wrap h2{margin: 0}

#like_counter{color:blueviolet;font-weight:600;font-size:21px;padding:3px;background-color:yellow}
.mpme-social-share a{display:inline-block;margin-left:20px}
.mpme-image_grid.hide{display:none}
.mpme-image-hide{

    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    background:#f46165;
    border-radius:30px;
    border:none;
    color:#fff;
    padding:12px 12px 12px 12px;
    margin-bottom:0px;
    font-size:16px}

.mpme-image-hide svg{height:30px}

.mpme-likes{display:flex;align-items:center;justify-content:center}
.mpme-likes-count{padding:0;margin:0}
.mpme_post-thumbnail img{width:100%;height:300px;object-fit:cover}
#mpme-content{background-color:aliceblue}
.mpme-archive-content-wrapper,
.mpme-article-recipe-content{padding:30px 0}
.mpme_archive-recipe h2{font-size:19px;line-height:32px;text-align:left!important}
.mpme_button{background-color:blue;display:block;margin:auto}

.mpme_post-grid-wrapper{
    --w: 768px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(clamp(100% /(var(--n) + 1) + 0.1%,(var(--w) - 100vw)* 1000, 100%), 1fr));
    gap:4vh;
    margin: 40px 0;
    grid-auto-rows: 1fr;
    justify-items: center;
}


.mpme-meta{
--n:3;
--w: 768px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(clamp(100% /(var(--n) + 1) + 0.1%,(var(--w) - 100vw)* 1000, 100%), 1fr));
  grid-gap: 15px;
/*  grid-auto-rows: 1fr;*/
 
 }

 .mpme-meta > *{background-color: #d6e6ef;padding: 20px}

 .responive-5-columns{
  --auto-grid-min-size: 16rem;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(var(--auto-grid-min-size), 1fr));
  grid-gap: 1rem;
  justify-content: center;
  justify-items: center;

}
.mpme-container .mpme-recipe{position: relative;}
.mpme-image_grid{margin-top: 30px}
.mpme-modal-close,
.mpme-modal-trigger{background: transparent;text-decoration: none;color: var(--brown);padding:0}
.mpme-modal-close{width:20px;cursor:pointer;font-size:30px;display:block}
.mpme-modal {display:none}

.mpme-modal{
    position:absolute;
    top:-10px;
    max-width:400px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid #ddd;
    box-shadow: -10px 0px 8px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
    color: #111;
    padding: 20px;
    z-index: 100000000000000000000000000001;
    border-radius:30px;
}

@media(min-width:560px){
    .mpme-modal{
        position: fixed;
        top:35%;
        left: 50%;
        transform: translate(-200px, -200px);
        width: 400px;
    }

}

.mpme-modal p {font-size:13pt}
.mpme-modal li{padding:0;margin:0;font-size:1.6rem;line-height:10px}

#mpme-floating-box{
display: block;
    position: fixed;
    bottom: 140px;
    right: 10px;
    background: #fff;
    background: rgba(220, 220, 220, 0.8);
    border-radius: 30px;
    padding: 12px;
    z-index: 999999999;
    transition: right 0.7s;
}

.mpme-floating-side-box span{display: block;
    text-align: center;
    font-size: 7pt;
    color: #000;
    text-decoration: none;
    margin-top:5px;}

.mpme-floating-side-box svg{width: 20px;height: 20px}
.mpme-floating-side-box a{text-decoration: none;}