/*
Theme Name: Carrino
Description: Gutenberg FrontEnd Styles
Version: 1.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/**
 * Frontend gutenberg palette 
 */
/* Backgrounds */
.has-light-grey-background-color {
	background:  var(--light-grey);
}
.has-medium-grey-background-color {
	background:  var(--medium-grey);
}
.has-dark-grey-background-color {
	background:  var(--dark-grey);
}
.has-very-dark-grey-background-color {
	background:  var(--very-dark-grey);
}
.has-theme-color-one-background-color {
	background:  var(--theme-color-1);
}
.has-theme-color-two-background-color {
	background:  var(--theme-color-2);
}
.has-theme-color-three-background-color {
	background:  var(--theme-color-3);
}
.has-theme-color-four-background-color {
	background:  var(--theme-color-4);
}
/* Colors */
.has-light-grey-color {
	color:  var(--light-grey);
}
.has-medium-grey-color {
	color:  var(--medium-grey);
}
.has-dark-grey-color {
	color:  var(--dark-grey);
}
.has-very-dark-grey-color {
	color:  var(--very-dark-grey);
}
.has-theme-color-one-color {
	color:  var(--theme-color-1);
}
.has-theme-color-two-color {
	color:  var(--theme-color-2);
}
.has-theme-color-three-color {
	color:  var(--theme-color-3);
}
.has-theme-color-four-color {
	color:  var(--theme-color-4);
}
/**
 * Subhead
 */
p.wp-block-subhead {
	font-style: normal;
	color: var(--medium-grey);
	font-size: 1.125rem; /* 18px */
	line-height: 1.5rem; /* 24px */
	margin-bottom: 10px;
}
/**
 * Dropcaps
 */
p.has-drop-cap:not(:focus)::first-letter {
	font-size: 6.25rem; /* 110px */
	font-weight: 500;
}
/**
 * Image Block Add top and bottom margin
 */
figure.wp-block-image {
 	margin-top: 30px;
 	margin-bottom: 30px;
}
figure.wp-block-image figcaption {
	text-align: center;
	margin-top: .5em;
	margin-bottom: 1em;
	color: #555d66;
	font-size: 13px;
}
/**
 * Latest posts Widget
 */
 .wp-block-latest-posts {}
.wp-block-latest-posts:not(.alignwide):not(.alignfull) {
	margin-left: 0;
	width:100%;
}
.wp-block-latest-posts li {
	display:block;
	padding:30px;
	line-height: 1.2;
	margin:30px 0;
	background: var(--theme-color-2);
	border-radius: 7px;
}
/* Alignfull & Wide */
.wp-block-latest-posts.alignfull,
.wp-block-latest-posts.alignwide {
	text-align: center;
}
.wp-block-latest-posts.alignfull li,
.wp-block-latest-posts.alignwide li {
	max-width: 875px;
	display:block;
	margin:0 auto;
	text-align: left;
}
.wp-block-latest-posts a {
	color: var(--white);
	text-decoration: none;
	font-family: var(--title-font);
	font-weight: 600;
}
.wp-block-latest-posts__post-date {
	color: var(--white);
	text-transform: uppercase;
	margin-top: 15px;
	font-weight: 700;
	font-family: var(--title-font);
}
/* Grid */
 .wp-block-latest-posts.is-grid {}
 .wp-block-latest-posts.is-grid.alignfull {
	padding:30px;
}
.wp-block-latest-posts.is-grid li {
	margin: 30px 30px 0 0;
}
.wp-block-latest-posts.columns-2 li {
	width:calc(50% - 30px);
}
.wp-block-latest-posts:not(.alignfull).is-grid li {
	max-width: 420px;
}
.wp-block-latest-posts.columns-2 li:nth-child(odd) {
	margin-left: 0;
}
.wp-block-latest-posts.columns-2 li:nth-child(even) {
	margin-right: 0;
}
/* 3 or more columns set to 50% unless fullwidth */
.wp-block-latest-posts.is-grid:not(.alignfull):not(.columns-2) li {
	width: calc(50% - 30px);
}
/**
 * Categories Widget
 */
.wp-block-categories:not(.alignright):not(.alignfull) {
	margin-left: 0
}
.wp-block-archives:not(.alignright):not(.alignfull) {
	margin-left: 0;
}
.wp-block-categories.alignfull {
	padding-left:30px;
	padding-right: 30px;
}
.wp-block-archives:not(.alignright):not(.alignfull) {
	margin-left: 0;
}
.wp-block-categories li,
.wp-block-archives li {
	border-bottom: 1px solid var(--light-border-color);
	margin:0;
	padding:0;
	text-align: left
}
.wp-block-categories li ul.children li:last-child {
	border:none;
}
.wp-block-categories li ul.children li:before {
	content:none;
}
.wp-block-categories ul.children li a {

}
.wp-block-categories a,
.wp-block-archives a {
	text-decoration: none;
	padding: 13px 0;
	display:inline-block;
}
/* Align Left Right  */
.wp-block-archives.alignleft,
.wp-block-archives.alignright,
.wp-block-categories.alignleft,
.wp-block-categories.alignright {
	width:100%;
	max-width: 305px;
}
/**
 * Buttons
 */
.wp-block-button .wp-block-button__link {
	border:0;
	background: var(--theme-color-2);
	color: var(--white);
	padding:15px 25px;
	text-transform: uppercase;
	font-weight: 600;
	border-radius: 5px;
	font-size: 16px;
}
/**
 * Gallery
 */
 /* We don't support left/right align galleries force full width */
 .wp-block-gallery.alignleft,
 .wp-block-gallery.alignright,
 [data-align="left"] .wp-block-gallery,
 [data-align="right"] .wp-block-gallery {
 	max-width:100%;
 }
.wp-block-gallery:not(.alignfull):not(.alignwide) {
	margin:0;
}
.wp-block-gallery.alignwide {

}
/* WP5.3 */
.wp-block-gallery .blocks-gallery-item:before {
	content: none !important;
}
/* end */
.wp-block-gallery .blocks-gallery-image,
.wp-block-gallery .blocks-gallery-item {
	 margin:15px;
	 width:calc(50% - 30px);
}
.wp-block-gallery.columns-3 .blocks-gallery-image,
.wp-block-gallery.columns-3 .blocks-gallery-item {
	width: calc(100% / 3 - 30px);
}
/* Lose the left margin first item of each row */
.wp-block-gallery:not(.columns-1):not(.columns-2) .blocks-gallery-item:nth-child(3n+1),
.wp-block-gallery:not(.columns-1):not(.columns-2) .blocks-gallery-image:nth-child(3n+1),
.wp-block-gallery.columns-2 .blocks-gallery-item:nth-child(2n+1),
.wp-block-gallery.columns-2 .blocks-gallery-image:nth-child(2n+1),
.wp-block-gallery.columns-1 .blocks-gallery-item,
.wp-block-gallery.columns-1 .blocks-gallery-image {
	margin-left: 0;
}
.wp-block-gallery.columns-4 .blocks-gallery-image,
.wp-block-gallery.columns-4 .blocks-gallery-item,
.wp-block-gallery.columns-5 .blocks-gallery-image,
.wp-block-gallery.columns-5 .blocks-gallery-item,
.wp-block-gallery.columns-6 .blocks-gallery-image,
.wp-block-gallery.columns-6 .blocks-gallery-item,
.wp-block-gallery.columns-7 .blocks-gallery-image,
.wp-block-gallery.columns-7 .blocks-gallery-item,
.wp-block-gallery.columns-8 .blocks-gallery-image,
.wp-block-gallery.columns-8 .blocks-gallery-item {
	width: calc(100% / 3 - 30px);
	margin:15px;
}
.wp-block-gallery.columns-4 .blocks-gallery-image:nth-child(3n+3),
.wp-block-gallery.columns-4 .blocks-gallery-item:nth-child(3n+3),
.wp-block-gallery.columns-5 .blocks-gallery-image:nth-child(3n+3),
.wp-block-gallery.columns-5 .blocks-gallery-item:nth-child(3n+3),
.wp-block-gallery.columns-6 .blocks-gallery-image:nth-child(3n+3),
.wp-block-gallery.columns-6 .blocks-gallery-item:nth-child(3n+3),
.wp-block-gallery.columns-7 .blocks-gallery-image:nth-child(3n+3),
.wp-block-gallery.columns-7 .blocks-gallery-item:nth-child(3n+3),
.wp-block-gallery.columns-8 .blocks-gallery-image:nth-child(3n+3),
.wp-block-gallery.columns-8 .blocks-gallery-item:nth-child(3n+3) {
	margin-right:0;
}
.wp-block-gallery.columns-4 .blocks-gallery-image:nth-of-type(4n):not(:last-child), .wp-block-gallery.columns-4 .blocks-gallery-item:nth-of-type(4n):not(:last-child),
.wp-block-gallery.columns-5 .blocks-gallery-image:nth-of-type(5n):not(:last-child), .wp-block-gallery.columns-5 .blocks-gallery-item:nth-of-type(5n):not(:last-child) {
	margin-right: 15px
}
.wp-block-gallery.columns-4 .blocks-gallery-image:nth-of-type(5n):last-child, .wp-block-gallery.columns-4 .blocks-gallery-item:nth-of-type(5n):last-child {
	margin-right: 0;
}
/**
 * Seperator
 */
.wp-block-separator {
	box-sizing: content-box;
	max-width:100px;
	border:0;
	height:2px;
	background: var(--light-grey);
	margin: 30px auto;
}
.wp-block-separator.is-style-wide {
	height:1px;
	background: var(--light-border-color);
	max-width:100%;
}
.wp-block-separator.is-style-dots::before {
	font-size: 32px;
	letter-spacing: 2em;
	color: var(--medium-grey);
}
/**
 * Verse
 */
pre.wp-block-verse {
	white-space: pre-wrap;
	word-wrap: break-word;
	text-align: justify;
}
/**
 * Blockquotes & Pullquotes
 */
.wp-block-quote.is-large,
.wp-block-quote.is-style-large {
	padding-bottom: 30px;
}
.wp-block-quote.is-large p,
.wp-block-quote.is-style-large p {
	font-style: normal;
	font-size: 3rem;
	line-height: 1.2;
	letter-spacing: -1px;
}
.has-sidebar .wp-block-quote.is-large p,
.has-sidebar .wp-block-quote.is-style-large p {
	font-size: 2.5rem;
	line-height: 1.1;
}
/* Has quotemarks classs styling */
.wp-block-quote.has-quote-marks p:first-of-type::before,
.wp-block-pullquote.has-quote-marks p:first-of-type::before {
	font-family: "fontello";
	content: "\e80a"; /* quote left */
	margin-right: 20px;
	position: relative;
	top:-10px;
	font-size: 32px;
}
.wp-block-quote.has-quote-marks p:first-of-type::after,
.wp-block-pullquote.has-quote-marks p:first-of-type::after {
	font-family: "fontello";
	content: "\e810"; /* quote right */
	margin-left: 20px;
	position: relative;
	bottom:-10px;
	font-size: 32px;
}
.wp-block-quote.has-quote-marks.is-style-large p:first-of-type::before {
	font-size: 3.25rem;
	margin-right:30px;
}
.wp-block-quote.has-quote-marks.is-style-large p:first-of-type::after {
	font-size: 3.25rem;
	margin-left:30px;
}
.wp-block-pullquote.has-quote-marks p:first-of-type::before {
	font-size: 28px;
	top:-5px;
	margin-right: 10px;
}
.wp-block-pullquote.has-quote-marks p:first-of-type::after {
	font-size: 28px;
	bottom:-5px;
	margin-left: 10px;
}
/* Pullquotes */
.wp-block-pullquote {
	margin-top:30px;
	margin-bottom: 30px;
	padding:30px 0 20px 0;
	position: relative;
}
.wp-block-pullquote[style*="border"] {
	border-top: 3px solid;
	border-bottom: 3px solid;
}
.wp-block-pullquote blockquote {
	border:0;
	padding:0;
	font-weight: 500;
	margin:0;
}
.wp-block-pullquote blockquote:not(.has-text-color) {
	color: var(--theme-color-2);
}
.wp-block-pullquote.alignfull blockquote {
	padding: 0 30px;
	max-width: 875px;
	margin:auto;
}
.wp-block-pullquote p {
	line-height: 1.3;
	margin:20px 0 30px 0;
}
.wp-block-pullquote cite {
	text-transform: capitalize;
	margin-bottom: 34px;
	display:block;
}
.wp-block-pullquote cite:before {
	content:none;
}
.wp-block-pullquote blockquote:not(.has-text-color) cite {
	color: var(--medium-grey);
}
/* Aligned Pullquotes */
.wp-block-pullquote.aligncenter {
	max-width: 305px;
}
.wp-block-pullquote.alignleft,
.wp-block-pullquote.alignright {
	margin-top: 15px;
	padding:20px 20px 10px 20px;
	margin-bottom: 15px;
}
.wp-block-pullquote.alignleft p,
.wp-block-pullquote.alignright p,
.wp-block-pullquote.is-style-solid-color blockquote p {
	font-size: 1.375rem; /* 22px */
}
.wp-block-pullquote.alignfull p,
.wp-block-pullquote.alignwide p {
	font-size: 2rem; /* 32px */
}
.wp-block-pullquote.alignfull.is-style-solid-color blockquote p {
	font-size: 1.625rem; /* 26px */
}
/* Solid background style */
.wp-block-pullquote.is-style-solid-color:not(.alignleft):not(.alignright) {
	padding:60px 0 60px 0;
	border:0;
}
.wp-block-pullquote.is-style-solid-color.alignleft blockquote,
.wp-block-pullquote.is-style-solid-color.alignright blockquote {
	max-width:100%;
	padding: 0 30px;
}
.wp-block-pullquote.is-style-solid-color blockquote p {
	margin:20px 0 30px 0;
}
/**
 * Latest Comments Block Widget
 */
ol.wp-block-latest-comments {}
ol.wp-block-latest-comments:not([class*="align"]) {
	margin-left:0;
}
ol.wp-block-latest-comments li {
	padding: 30px;
	text-align: left;
	background: var(--theme-color-2);
	margin: 30px 0;
	border-radius: 7px;
}
/* Full Align */
ol.wp-block-latest-comments.alignfull,
ol.wp-block-latest-comments.alignwide {
	text-align: center;
}
ol.wp-block-latest-comments.alignfull li,
ol.wp-block-latest-comments.alignwide li {
	max-width: 875px;
	margin:30px auto;
	text-align: left;
}
ol.wp-block-latest-comments li:before {
	content:none !important;
}
.wp-block-latest-comments footer {
	font-size: 12px;
	padding-left:15px;
	font-family: var(--title-font);
	color: var(--white);
}
.wp-block-latest-comments footer a {
	color: var(--white);
	text-decoration: none;
	text-transform: uppercase;
	font-weight: 700;
}
.wp-block-latest-comments__comment-author {
	text-transform: uppercase;
	font-weight: 700;
}
.wp-block-latest-comments__comment-date {
	text-transform: uppercase;
	color: var(--white);
	text-decoration: none;
	margin-top: 5px;
	font-family: var(--title-font);
	font-weight: 700;
}
.wp-block-latest-comments__comment {
	padding: 15px 0;
	margin:0;
}
.wp-block-latest-comments__comment-excerpt p {
	color: var(--white);
	font-family: var(--title-font);
	font-weight: 600;
	font-size: 1.25rem;
	line-height: 1.4;
	padding-left: 15px;
}
/* Left Right Align */
ol.wp-block-latest-comments.alignleft,
ol.wp-block-latest-comments.alignright {
	max-width: 305px;
	padding:0 0 30px 0;
}
ol.wp-block-latest-comments.alignleft li,
ol.wp-block-latest-comments.alignright li {
	padding: 30px 30px 0 30px;
}
/* Left Right Align */
.wp-block-latest-comments.alignleft.has-avatars .wp-block-latest-comments__comment .wp-block-latest-comments__comment-excerpt,
.wp-block-latest-comments.alignleft.has-avatars .wp-block-latest-comments__comment .wp-block-latest-comments__comment-meta,
.wp-block-latest-comments.alignright.has-avatars .wp-block-latest-comments__comment .wp-block-latest-comments__comment-excerpt,
.wp-block-latest-comments.alignright.has-avatars .wp-block-latest-comments__comment .wp-block-latest-comments__comment-meta {
	clear:both;
	margin-left: 0;
	margin-top: 15px;
	margin-bottom: 15px;
	padding:0;
}
.wp-block-latest-comments.alignleft .avatar,
.wp-block-latest-comments.alignleft  .wp-block-latest-comments__comment-avatar,
.wp-block-latest-comments.alignright .avatar,
.wp-block-latest-comments.alignright  .wp-block-latest-comments__comment-avatar {
	margin:0;
	clear:both;
	float:none;
}
.wp-block-latest-comments.alignleft .wp-block-latest-comments__comment-excerpt p,
.wp-block-latest-comments.alignright .wp-block-latest-comments__comment-excerpt p {
	padding-left: 0;
	font-size: 18px;
}
/**
 * Cover Images/Media
 */
.wp-block-cover-image .wp-block-cover-image-text,
.wp-block-cover-image .wp-block-cover-text,
.wp-block-cover-image h2,
.wp-block-cover .wp-block-cover-image-text,
.wp-block-cover .wp-block-cover-text,
.wp-block-cover h2 {
	font-family: var(--title-font);
	font-weight: 700;
	max-width: 875px;
	padding: 20px;
	margin:0;
}
/* Embed Media all 100% width */
.wp-block-embed:not(.alignfull):not(.alignwide) {
	max-width: 100%;
	width:100%;
	margin-left:auto;
	margin-right:auto;
	margin-bottom: 30px;
}
.twitter-tweet {
	margin:auto;
}
/**
 * Media Queries
 */
@media ( max-width: 1280px) {
	.wp-block-latest-posts.columns-6 li,
	.wp-block-latest-posts.columns-5 li {
		width: calc(100% / 3 - 15px );
	}
	.wp-block-latest-posts.columns-4 li {
		width:calc(50% - 15px);
	}
	.wp-block-quote.is-large p,
	.wp-block-quote.is-style-large p {
		font-size: 40px;
		line-height: 1.1;
	}
}
@media (max-width:1060px) {
	.wp-block-latest-posts[class*="columns"] li {
		width:50% !important;
		margin-left:0 !important;
		margin-right: 0 !important;
	}
}
@media (max-width: 890px) {
	.wp-block-columns.has-4-columns  {
		flex-wrap:wrap;
	}
	.wp-block-columns.has-4-columns .wp-block-column:nth-child(2n+2) {
		padding-right: 0;
	}
	.wp-block-columns.has-4-columns .wp-block-column:not(:first-child):nth-child(odd) {
		padding-left:0;
	}
}
@media (max-width: 781px) {
	.wp-block-columns.has-3-columns .wp-block-column:nth-child(3n+3) {
		flex-basis: 100%;
		padding:0;
	}
}
@media (max-width: 768px) {
	.wp-block-latest-comments__comment-excerpt p {
		font-size: 18px;
	}
	.has-avatars .wp-block-latest-comments__comment .wp-block-latest-comments__comment-excerpt,
	.has-avatars .wp-block-latest-comments__comment .wp-block-latest-comments__comment-meta {
		clear:both;
		margin-left: 0;
		margin-top: 15px;
		margin-bottom: 15px;
		padding:0;
	}
	.wp-block-latest-comments__comment-excerpt p {
		padding-left: 0
	}
	.wp-block-latest-comments .avatar, .wp-block-latest-comments__comment-avatar {
		margin:0;
		clear:both;
		float:none;
	}
}
@media (max-width:680px) {
	.wp-block-gallery .blocks-gallery-image,
	.wp-block-gallery .blocks-gallery-item {
		width: calc(100% / 2 - 30px) !important;
		margin-right: 15px !important;
	}
	.wp-block-gallery:not(.columns-1) .blocks-gallery-image:nth-child(odd),
	.wp-block-gallery:not(.columns-1) .blocks-gallery-item:nth-child(odd) {
		margin-left:0;
		margin-right: 15px;
	}
	.wp-block-gallery:not(.columns-1) .blocks-gallery-image:nth-child(odd):last-of-type,
	.wp-block-gallery:not(.columns-1) .blocks-gallery-item:nth-child(odd):last-of-type {
		margin-right: 0 !important;
	}
	.wp-block-gallery:not(.columns-1) .blocks-gallery-image:nth-child(even),
	.wp-block-gallery:not(.columns-1) .blocks-gallery-item:nth-child(even) {
		margin-right:0 !important;
		margin-left: 15px !important;
	}
	.wp-block-gallery .blocks-gallery-image figcaption,
	.wp-block-gallery .blocks-gallery-item figcaption {
		display:none;
	}
	/* Block Columns Set all to 100% flex-basis */
	.wp-block-columns[class*="has-"] .wp-block-column {
		flex-basis: 100%;
		padding:0;
	}
	/* Latest posts grid set to 100% width */
	.wp-block-latest-posts[class*="columns"] li {
		width:100% !important;
		margin-left:0 !important;
		margin-right: 0 !important;
	}
	/* Separator */
	.wp-block-separator.is-style-dots::before {
		letter-spacing: 1em;
		padding-left: 1em
	}
	/* Latest Posts */
	.wp-block-latest-posts:not(.alignwide):not(.alignfull) {
		padding:15px;
	}
	.wp-block-latest-posts li {
		padding:15px;
	}
	/* Recent Comments */
	ol.wp-block-latest-comments {
		padding:0
	}
}
@media (max-width:580px) {
	.wp-block-pullquote.alignleft,
	.wp-block-pullquote.alignright {
		max-width: 100%;
		float:none;
		margin-left:0;
		margin-right: 0;
		display:block;
	}
}
@media (max-width:480px) {
	.wp-block-pullquote.alignfull p, .wp-block-pullquote.alignwide p,
	.wp-block-pullquote.is-style-solid-color.alignfull blockquote p {
		font-size: 22px;
	}
	.wp-block-pullquote.is-style-solid-color.alignfull blockquote {
		max-width:80%;
		padding: 0 30px;
	}
	.wp-block-quote.is-large p,
	.wp-block-quote.is-style-large p {
		font-size:28px !important;
		line-height: 1.2;
	}
	.wp-block-quote.has-quote-marks p:first-of-type::before {
		font-size: 28px;
		margin-right:10px;
	}
	.wp-block-quote.has-quote-marks p:first-of-type::after {
		font-size: 28px;
		margin-left:10px;
	}
	.wp-block-quote.has-quote-marks.is-style-large p:first-of-type::before {
		font-size: 28px;
		margin-right: 10px;
	}
	.wp-block-quote.has-quote-marks.is-style-large p:first-of-type::after {
		font-size: 28px;
		margin-left: 10px;
	}
	.wp-block-image figcaption {
		width:100%;
	}
}