/**
 * The following styles get applied both on the front of your site
 * and in the editor.
 *
 * Replace them with your own styles or remove the file completely.
 */

.vending-block {
	background-color: #21759b;
	color: #fff;
	padding: 2px;
}

.vending-border-radius {
	border-radius:16px;
}

.vending-two-columns {
		box-sizing: border-box;
    	display: grid;
    	grid-template-columns: 40% 1fr;
    	grid-template-rows: auto
}

.vending-island-name {
		margin: 1rem 0rem;
}

.vending-mt-1 {
		margin-top: 1rem;
}

.vending-mt-2 {
		margin-top: 2rem;
}

.vending-mt-3 {
		margin-top: 3rem;
}

.vending-ml-1 {
		margin-left: 1rem;
}

.vending-mx-1 {
		margin-left: 1rem;
		margin-right: 1rem;
}

.vending-my-1 {
		margin-top: 1rem;
		margin-bottom: 1rem;
}

.vending-button-padding {
	padding-top: 1rem;
    padding-right: 2.25rem;
    padding-bottom: 1rem;

}

.vending-button-margin {
	margin-top: 1rem;
    margin-bottom: 1rem;
}


@media (max-width: 600px) {
	.vending-is-stacked-on-mobile {
		grid-template-columns: 100% !important
	}

	.vending-island-name {
		margin: 1rem 1rem 0 1rem;
	}

	.vending-island-name {
		margin:0;
	}

	.vending-is-stacked-on-mobile>.vending-block-text {
		grid-column: 1;
		grid-row: 1
	}

	.vending-is-stacked-on-mobile>.vending-block-content {
		grid-column: 1;
		grid-row: 2
	}
}