/*
Theme Name: All About Organics
Description: All About Organics custom WordPress Theme
Version: 1
Author: Launch Interactive
Author URI: http://launchinteractive.com.au

*/

.alignwide
{
	position: relative;
	left: calc(-0.5 * var(--central-padding));
	width: calc(100% + var(--central-padding));
}

.alignfull
{
	position: relative;
	left: calc(-1 * var(--central-padding));
	width: calc(100% + 2 * var(--central-padding));
	padding-left: var(--central-padding);
	padding-right: var(--central-padding);
}

.wp-block-image.alignfull
{
	padding-left: 0;
	padding-right: 0;
}

.wp-caption
{
	text-align: center;
	font-size: .8em;
}

*
{
	box-sizing: border-box;
}

body
{
	--central-padding: max(7vw, calc(50vw - 650px));
	--section-padding: clamp(40px, 10vh, 60px);
}

#skipToMainContent
{
	position: fixed;
	top: 10px;
	left: -300px;
	z-index: 1000;

	transition: left 0.2s ease-in-out 2s;
}

#skipToMainContent:focus,
#skipToMainContent:active
{
	left: 10px;
	transition: left 0.2s ease-in-out 0s;
}

.central
{
	padding-left: 20px;
	padding-left: var(--central-padding);
	padding-right: 20px;
	padding-right: var(--central-padding);
}

img
{
	max-width: 100%;
	height: auto;
	vertical-align: top;
}

dl
{
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 5px 10px;
}

dt
{
	font-weight: 700;
	grid-column: 1;
}

dt::after
{
	content: ":";
}

dd
{
	grid-column: 2
}

a
{
	color: var(--wp--preset--color--blue);
}

/*
::-webkit-scrollbar
::-webkit-scrollbar-button
::-webkit-scrollbar-track
::-webkit-scrollbar-track-piece  
::-webkit-scrollbar-thumb
::-webkit-scrollbar-corner
::-webkit-resizer

:horizontal
:vertical
:decrement
:increment
:start
:end
:double-button
:single-button
:no-button
:corner-present
:window-inactive
*/
::-webkit-scrollbar
{
	width: 12px;
	height: 12px;
}

::-webkit-scrollbar-track
{
	background: #ddd;
}

::-webkit-scrollbar-thumb
{
	background: #AAA;
}

a[href^=tel]
{
	color: inherit;
	text-decoration: none;
}


.videoWrap
{
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}

.videoWrap iframe,
.videoWrap object,
.videoWrap embed,
.videoWrap video
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

@media (min-width: 350px)
{
	.noWidow
	{
		display: inline-block;
	}
}

@media (min-width: 500px)
{
	.alignwide
	{
		position: relative;
		left: -60px;
		width: calc(100% + 120px);
	}
}

@media (hover: hover)
{
	a:where(:hover)
	{
		color: var(--wp--preset--color--mblue);
	}
}

/*
@media all and (max-width: 960px) {

}
@media all and (max-width: 320px) {

}
*/