/**
 * Note that these styles are loaded *before* editor styles, so that
 * editor-specific styles using the same selectors will take precedence.
 */

/*.wp-block-gutenberg-examples-example-05-recipe-card .recipe-image {*/
/*	background: #f1f1f1;*/
/*	float: right;*/
/*	width: 50%;*/
/*	min-height: 100px;*/
/*	text-align: center;*/
/*}*/

/*.wp-block-gutenberg-examples-example-05-recipe-card .recipe-image button {*/
/*	margin-top: 30px;*/
/*}*/

/*.wp-block-gutenberg-examples-example-05-recipe-card .recipe-image button.image-button {*/
/*	margin: 0;*/
/*	padding: 0;*/
/*	display: block;*/
/*}*/

/*.wp-block-gutenberg-examples-example-05-recipe-card .recipe-image img {*/
/*	display: block;*/
/*	z-index: 1;*/
/*	position: relative;*/
/*}*/

/*.wp-block-gutenberg-examples-example-05-recipe-card h2 {*/
/*	font-size: 1.5em;*/
/*}*/

/*.wp-block-gutenberg-examples-example-05-recipe-card ul {*/
/*	padding-left: 2.5em !important; !* Needs fix in Gutenberg. *!*/
/*}*/

/*.wp-block-gutenberg-examples-example-05-recipe-card:after { */
/*	content:""; */
/*	clear:both; */
/*	display: table; */
/*}*/



html { font-size: 16px; }

html :where(.editor-styles-wrapper) h1.btn,
html :where(.editor-styles-wrapper) .h1.btn,
h1.btn, .h1.btn { font-size: 28px; }

html :where(.editor-styles-wrapper) h2,
html :where(.editor-styles-wrapper) .h2,
h2.btn, .h2.btn { font-size: 24px; }

html :where(.editor-styles-wrapper) h3.btn,
html :where(.editor-styles-wrapper) .h3.btn,
h3.btn, .h3.btn { font-size: 21px; }

html :where(.editor-styles-wrapper) h4.btn,
html :where(.editor-styles-wrapper) .h4.btn,
h4.btn, .h4.btn { font-size: 18px; }

html :where(.editor-styles-wrapper) h5.btn,
html :where(.editor-styles-wrapper) .h5.btn,
h5.btn, .h5.btn { font-size: 16px; }

html :where(.editor-styles-wrapper) h6.btn,
html :where(.editor-styles-wrapper) .h6.btn,
h6.btn, .h6.btn { font-size: 14px; }



html :where(.editor-styles-wrapper) h1,
html :where(.editor-styles-wrapper) .h1,
html :where(.editor-styles-wrapper) h2,
html :where(.editor-styles-wrapper) .h2,
html :where(.editor-styles-wrapper) h3,
html :where(.editor-styles-wrapper) .h3,
html :where(.editor-styles-wrapper) h4,
html :where(.editor-styles-wrapper) .h4,
html :where(.editor-styles-wrapper) h5,
html :where(.editor-styles-wrapper) .h5,
html :where(.editor-styles-wrapper) h6,
html :where(.editor-styles-wrapper) .h6,
html :where(.editor-styles-wrapper) p,
h1, h2, h3, h4, h5, h6, p,
.h1, .h2, .h3, .h4, .h5, .h6 {

    -webkit-transition: font-size .2s ease-out;
    -moz-transition: font-size .2s ease-out;
    transition: font-size .2s ease-out;
}


/* MQ-sm: Mobile (Landscape) */
/* ================================================== */
@media only screen and (min-width: 576px) {

    /*html {*/
    /*font-size: 18px;*/
    /*}*/

    html :where(.editor-styles-wrapper) h1.btn,
    html :where(.editor-styles-wrapper) .h1.btn,
    h1, .h1 { font-size: 36px; }

    html :where(.editor-styles-wrapper) h2.btn,
    html :where(.editor-styles-wrapper) .h2.btn,
    h2, .h2 { font-size: 28px; }

    html :where(.editor-styles-wrapper) h3.btn,
    html :where(.editor-styles-wrapper) .h3.btn,
    h3, .h3 { font-size: 24px; }

    html :where(.editor-styles-wrapper) h4.btn,
    html :where(.editor-styles-wrapper) .h4.btn,
    h4.btn, .h4.btn { font-size: 18px; }
}


/* MQ-md: Tablet (Portrait) */
/* ================================================== */
@media only screen and (min-width: 768px) {
    /*html {*/
    /*font-size: 18px;*/
    /*}*/

    html :where(.editor-styles-wrapper) h1.btn,
    html :where(.editor-styles-wrapper) .h1.btn,
    h1.btn, .h1.btn { font-size: 42px; }

    html :where(.editor-styles-wrapper) h2.btn,
    html :where(.editor-styles-wrapper) .h2.btn,
    h2.btn, .h2.btn { font-size: 30px; }

    html :where(.editor-styles-wrapper) h3.btn,
    html :where(.editor-styles-wrapper) .h3.btn,
    h3.btn, .h3.btn { font-size: 24px; }

    html :where(.editor-styles-wrapper) h4.btn,
    html :where(.editor-styles-wrapper) .h4.btn,
    h4.btn, .h4.btn { font-size: 19px; }
    /*h4, .h4 { font-size: 21px; }*/

    html :where(.editor-styles-wrapper) h5.btn,
    html :where(.editor-styles-wrapper) .h5.btn,
    h5.btn, .h5.btn { font-size: 16px; }

    html :where(.editor-styles-wrapper) h6.btn,
    html :where(.editor-styles-wrapper) .h6.btn,
    h6.btn, .h6.btn { font-size: 14px; }
}


/* MQ-lg: Tablet (Landscape) */
/* ================================================== */
@media only screen and (min-width: 992px) {
    /*html {*/
    /*font-size: 18px;*/
    /*}*/
}


/* MQ--dt: Desktop (Laptop) */
/* ================================================== */
@media only screen and (min-width:1025px) {
    /*html {*/
    /*font-size: 18px;*/
    /*}*/
}


/* MQ-xl: Desktop (Wide) */
/* ================================================== */
@media only screen and (min-width:1160px) {
    /*html {*/
    /*font-size: 20px;*/
    /*}*/

    html :where(.editor-styles-wrapper) h1.btn,
    html :where(.editor-styles-wrapper) .h1.btn,
    h1.btn, .h1.btn { font-size: 48px; }

    html :where(.editor-styles-wrapper) h2.btn,
    html :where(.editor-styles-wrapper) .h2.btn,
    h2.btn, .h2.btn { font-size: 36px; }

    html :where(.editor-styles-wrapper) h3.btn,
    html :where(.editor-styles-wrapper) .h3.btn,
    h3.btn, .h3.btn { font-size: 30px; }

    html :where(.editor-styles-wrapper) h4.btn,
    html :where(.editor-styles-wrapper) .h4.btn,
    h4.btn, .h4.btn { font-size: 23px; }
    /*h4, .h1 { font-size: 24px; }*/

    html :where(.editor-styles-wrapper) h5.btn,
    html :where(.editor-styles-wrapper) .h5.btn,
    h5.btn, .h5.btn { font-size: 18px; }
}