/*
Theme Name: Longerenong College 2023
Description: Bespoke Wordpress Theme for the Longerenong college
Version: 1
Author: Launch Interactive
Author URI: http://launchinteractive.com.au

*/

#content
{
	/**
	 * Fixes odd horizontal scrollbar bug.
	 * When the page loads there is a horizontal scroll bar due to the way the alignfull styles work. It appears to be due to an offscreen element being transformed, but we have not been able to adequately prove this or even resolve it.
	 */
	contain: paint;
}

.alignwide
{
	position: relative;
	left: calc(-0.5 * var(--wp--custom--h-inset));
	width: calc(100% + var(--wp--custom--h-inset));
}

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

.wp-block-image.alignfull,
.wp-block-embed.alignfull,
.wp-block-video.alignfull,
.wp-block-columns.alignfull
{
	padding-left: 0;
	padding-right: 0;
}

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

*
{
	box-sizing: border-box;
}

html
{
	background: #00669E;
}

body
{
	-webkit-font-smoothing: antialiased;
}

h1 + p,
h2 + p,
h3 + p
{
	margin-top: 5px;
}

blockquote
{
	border-left: 5px solid var(--wp--preset--color--dblue);
	padding-left: 30px;
}

#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(--wp--custom--h-inset);
	padding-right: 20px;
	padding-right: var(--wp--custom--h-inset);
}

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

/*
::-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%;
}

.wp-block-button__link
{
	display: flex;
	align-items: center;
	justify-content: center;
}

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

	a > .noWidow
	{
		text-decoration: underline;
	}

	/*
	 * This makes sure the spans in an anchor get an underline when display: inline-block
	*/
	a:not([href^=tel:]) .noWidow
	{
		text-decoration: underline;
	}
}

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

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

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

}
*/


.reveal
{
	transform: translateX(100vw);
	animation: 2s ease-out 0s 1 Reveal forwards;
}
@keyframes Reveal
{
	0%
	{
		transform: translateX(100vw)
	}
	100%
	{
		transform: translateX(0%)
	}
}

.reveal1
{
	transform: translateX(100vw);
	animation: 2s ease-out .5s 1 Reveal forwards;
}
.reveal2
{
	transform: translateX(100vw);
	animation: 2s ease-out 1s 1 Reveal forwards;
}