@font-face {
    font-family: 'Century';
    src: url(../fonts/Century.ttf) format('truetype');
    font-display: swap;
}

* {font-family:Century;margin: 0;padding: 0;}

body {
    padding: 0;
    border: 0;
    margin: 0;
    background: #FFF;
    color: #464646;
    font-size: 1em;
    letter-spacing: 0.05em;
}


h1 {font-weight: normal;margin: 0px 0 5px 0;padding-top: 50px;}
h2 {margin: 0px 0 40px 0;}
h4 {color: #000;margin: 0 0 25px 0;padding: 0;font-size: 1.25em}

.form-control {border: #AAA 1px solid;padding: 7px;border-radius: 5px;font-size: 1em;}
::-webkit-input-placeholder {color: #AAA;}
:-ms-input-placeholder {color: #AAA;}
::placeholder {color: #AAA;}
.has-danger {border-color: #C00}

hr {padding: 0;margin: 0;border: 0;border-top: #E0E0E0 1px solid;}
a, .link {text-decoration: none;color: #000;cursor: pointer;}

button, input[type="submit"], .btn {
    background-color: #7F0027;
    color:#FFF;
    padding: 7px 0;
    min-width: 120px;
    border-radius: 3px;
    border: 0;
    font-size: 1em
}


.text-center {text-align: center;}
.text-end, .text-right {text-align: right;}
.text-start, .text-left {text-align: left;}

.p-5 {padding: 5px}
.p-10 {padding: 10px}
.p-15 {padding: 15px}
.p-20 {padding: 20px}
.p-25 {padding: 25px}
.p-30 {padding: 30px}
.p-35 {padding: 35px}
.p-40 {padding: 40px}
.p-45 {padding: 45px}
.p-50 {padding: 50px}

.pt-5 {padding-top: 5px}
.pt-10 {padding-top: 10px}
.pt-15 {padding-top: 15px}
.pt-20 {padding-top: 20px}
.pt-25 {padding-top: 25px}
.pt-30 {padding-top: 30px}
.pt-35 {padding-top: 35px}
.pt-40 {padding-top: 40px}
.pt-45 {padding-top: 45px}
.pt-50 {padding-top: 50px}

.pb-5 {padding-bottom: 5px}
.pb-10 {padding-bottom: 10px}
.pb-15 {padding-bottom: 15px}
.pb-20 {padding-bottom: 20px}
.pb-25 {padding-bottom: 25px}
.pb-30 {padding-bottom: 30px}
.pb-35 {padding-bottom: 35px}
.pb-40 {padding-bottom: 40px}
.pb-45 {padding-bottom: 45px}
.pb-50 {padding-bottom: 50px}

.pl-5 {padding-left: 5px}
.pl-10 {padding-left: 10px}
.pl-15 {padding-left: 15px}
.pl-20 {padding-left: 20px}
.pl-25 {padding-left: 25px}
.pl-30 {padding-left: 30px}
.pl-35 {padding-left: 35px}
.pl-40 {padding-left: 40px}
.pl-45 {padding-left: 45px}
.pl-50 {padding-left: 50px}

.pr-5 {padding-right: 5px}
.pr-10 {padding-right: 10px}
.pr-15 {padding-right: 15px}
.pr-20 {padding-right: 20px}
.pr-25 {padding-right: 25px}
.pr-30 {padding-right: 30px}
.pr-35 {padding-right: 35px}
.pr-40 {padding-right: 40px}
.pr-45 {padding-right: 45px}
.pr-50 {padding-right: 50px}

.m-5 {margin: 5px}
.m-10 {margin: 10px}
.m-15 {margin: 15px}
.m-20 {margin: 20px}
.m-25 {margin: 25px}
.m-30 {margin: 30px}
.m-35 {margin: 35px}
.m-40 {margin: 40px}
.m-45 {margin: 45px}
.m-50 {margin: 50px}

.mt-5 {margin-top: 5px}
.mt-10 {margin-top: 10px}
.mt-15 {margin-top: 15px}
.mt-20 {margin-top: 20px}
.mt-25 {margin-top: 25px}
.mt-30 {margin-top: 30px}
.mt-35 {margin-top: 35px}
.mt-40 {margin-top: 40px}
.mt-45 {margin-top: 45px}
.mt-50 {margin-top: 50px}

.mb-5 {margin-bottom: 5px}
.mb-10 {margin-bottom: 10px}
.mb-15 {margin-bottom: 15px}
.mb-20 {margin-bottom: 20px}
.mb-25 {margin-bottom: 25px}
.mb-30 {margin-bottom: 30px}
.mb-35 {margin-bottom: 35px}
.mb-40 {margin-bottom: 40px}
.mb-45 {margin-bottom: 45px}
.mb-50 {margin-bottom: 50px}

.ml-5 {margin-left: 5px}
.ml-10 {margin-left: 10px}
.ml-15 {margin-left: 15px}
.ml-20 {margin-left: 20px}
.ml-25 {margin-left: 25px}
.ml-30 {margin-left: 30px}
.ml-35 {margin-left: 35px}
.ml-40 {margin-left: 40px}
.ml-45 {margin-left: 45px}
.ml-50 {margin-left: 50px}

.mr-5 {margin-right: 5px}
.mr-10 {margin-right: 10px}
.mr-15 {margin-right: 15px}
.mr-20 {margin-right: 20px}
.mr-25 {margin-right: 25px}
.mr-30 {margin-right: 30px}
.mr-35 {margin-right: 35px}
.mr-40 {margin-right: 40px}
.mr-45 {margin-right: 45px}
.mr-50 {margin-right: 50px}

.w-5 {width:5%}
.w-10 {width: 10%}
.w-15 {width: 15%}
.w-20 {width: 20%}
.w-25 {width: 25%}
.w-30 {width: 30%}
.w-35 {width: 35%}
.w-40 {width: 40%}
.w-45 {width: 45%}
.w-50 {width: 50%}
.w-55 {width:55%}
.w-60 {width: 60%}
.w-65 {width: 65%}
.w-70 {width: 70%}
.w-75 {width: 75%}
.w-80 {width: 80%}
.w-85 {width: 85%}
.w-90 {width: 90%}
.w-95 {width: 95%}
.w-100 {width: 100%}

.d-none {display: none}
.d-block {display: block}
.d-inline-block {display: inline-block}


.movil {display: none;}
.left {float: left;}
.right {float: right;}
.clearfix {clear: both;}
.shadow {box-shadow: #CCC 0 0 15px;}
.shadow-top {box-shadow: #CCC 0 -10px 20px;}
.shadow-bottom {box-shadow: #CCC 0 15px 15px;}
.container {max-width: 1024px;margin: auto;}

#header {
    background-color: #FFF;
    color:#464646;
    box-shadow: #CCC 0 0 25px;
    z-index: 200;
    position: fixed;
    top: 0;
    width: 100%;
}

#header .bloque1 {display: inline-block;width: 30%;float: left;padding: 15px 0 5px 0}
#header .bloque2 {display: inline-block;text-align: center;width: 48%;}
#header .bloque2 div {display: flex;align-items: center;justify-content: center;height: 70px;}
#header .bloque2 a {padding: 0 20px}
#header .bloque3 {display: inline-block;float: right;}
#header .bloque3 a {padding: 20px 5px 0 0;display: inline-block;}
#header .bloque4 {display: none}

#footer {
    background: url('../images/back.jpg');
    background-position: center;
    background-size: cover;
    padding: 50px 0 40px 0;
    text-align: center;
    box-shadow: #CCC 0 0 25px;
    margin-top: 50px;
    z-index: 10;
}
#footer_copy {background-color: transparent;z-index: -1;color:#888;text-align: center;padding: 15px 0 7px 0;font-size: 0.75em}
#breadcrumbs {font-size: 12px;}
#content {margin-top: 70px;}
#menu {display: none;position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: #FFF;padding-top: 90px;z-index: 10;}
#menu a {color: #000;font-size: 1.25em;width: 100%;padding: 10px 25px 10px 25px;display: inline-block;}
#menu a.social {width: auto;margin-top: 20px;}
#menu form span {width: 87%;padding: 12px 18px;position: relative;top: -3px;}
#menu form input {font-size: 24px;width: 60%;margin-top: 15px;}

.snippet {width: 23%;float: left;margin: 0 1%;position: relative;padding-bottom: 40px;text-align: center;}
.snippet img {width: 100%;height: 325px;border-radius: 10px;margin-bottom: 10px;}
.snippet div {height: 35px;position: relative;}

.snippet_blog {width: 23%;float: left;margin: 0 1%;position: relative;padding-bottom: 40px;text-align: center;}
.snippet_blog img {width: 100%;height: 175px;border-radius: 10px;margin-bottom: 10px;}
.snippet_blog div {height: 35px;position: relative;}

#categorias a {width: 32%;float: left;margin: 0 1% 10px 0}
.opciones {width: 31%;display: inline-block;margin: 0.9%}

.pagination {width: 100%;margin: auto;display: block;list-style: none;text-decoration: none;text-align: center;}
.pagination li {display: inline-block;font-size: 1.25em;margin: 0 4px;}
.pagination li a[rel="next"], .pagination li a[rel="prev"] {font-size: 1.4em}
.pagination li.disabled span {font-size: 1.4em;color: #FFF}
.pagination li.active span {color: #7F0027;font-weight: bold;}

#blog .left {width: 40%}
#blog .imagen img {width: 100%;}

.imagenes_receta {width: 40%;float: left;}
.imagenes_receta img {width: 100%;}
.right_receta {width: 55%;float: left;margin: 0 0 50px 30px}

.layer-cookies-inicial {position: fixed;bottom: 0;left: 0;width: 100%;background: #FFF;z-index: 999}

@media(max-width: 768px) {

    body {letter-spacing: 0em;}
    h1 {font-size: 1.5em;padding-top: 35px;}
    h2 {margin-bottom: 25px;}
    .form-control {width: 95%}

    button, input[type="submit"], .btn {width: 100%;}

    #header .bloque1 {width: 70%;}
    #header .bloque2 {display: none}
    #header .bloque3 {display: none}
    #header .bloque4 {display: inline-block;float: right;width: 8%;padding: 25px 0 0 0;}
    #header .bloque4 .linea {border:#888 2px solid;width:100%;margin:0 0 5px 0;}

    .container {margin: 0 30px;}
    .desktop {display: none}
    .movil {display: initial;}

    .snippet {width: 90%;margin: 0 3%;}
    .snippet img {height: auto;}
    .snippet_blog {width: 90%;margin: 0 3%;}
    .snippet_blog img {height: auto;}

    #categorias a {width: 100%;}
    .opciones {width: 100%;}
    .opciones input {width: 69%;}

    #blog .left {width: 100%}

    .imagenes_receta {width: 100%;float: none;}
    .right_receta {float: none;margin: 0;width: 100%;}

    .imagenes_receta img {width: 100%;margin-bottom: 30px;}
}