@charset "UTF-8";

/*	BAREBONES RESPONSIVE GRID FRAMEWORK (Animation)
	Version 3.1
	December 2023
	www.dawgeatdawg.com
*/


/* @group --- COLOR SCHEME ---*/
/*---

	Main Text		=		hsl(50, 0%, 100%);		White
	Secondary		=		hsl(50, 40%, 60%);		Gold
	Highlight		=		hsl(300, 50%, 60%);		Purple
	BG Tint 1		=		hsl(260, 30%, 40%);		Purple Dark
	BG Tint 2		=		hsl(310, 30%, 30%);		Magenta Dark
	Background	=		black;

---*/
/* @end */


/* @group --- FONTS ---*/
	
@import url('https://fonts.googleapis.com/css?family=Merriweather');

@font-face {
	font-family: 'Dalli';
	src: url('fonts/dallianceroman-webfont.woff2') format('woff2'),
		url('fonts/dallianceroman-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

/* @end */



/* @group --- PRE-STUFF ---*/

a, textarea, input, select, img, section:focus { outline: none; }

strong, strong * { font-weight: bold; }

em, em * { font-style: italic; }

html { box-sizing: border-box; }
	*, *:before, *:after { box-sizing: inherit; }

a svg { fill: currentColor; }

/* @end */



/* @group --- GLOBAL VARIABLES ---*/
:root {
	/* --contentMaxWidth:	1400px;

	--borderRadiusBig:		2.0rem;
	--borderRadiusSmall:	1.0rem;
	
	--colorMain:				325, 60%, 40%;
	--colorSecondary:		70, 60%, 60%;
	--colorHighlight:		33, 80%, 60%;
	--colorExtra:				346, 73%, 57%;
	--colorBG:					0, 0%, 100%;
	--colorLight:				0, 0%, 100%;
	--colorDark:				0, 0%, 0%; */
}
/* @end */



/* @group --- BASIC HTML ELEMENTS ---*/
	
html { font-size: 100%; }

body {
	font-family: 'Merriweather', 'Garamond', 'Times New Roman', Georgia, serif;
	font-size: 100%;
	font-style: normal;
	font-weight: normal;
	line-height: 1.3em;
	letter-spacing: 0.05em;
	word-spacing: 0.2em;
	color: hsl(50, 0%, 100%);
}

p {
	margin: 0 0 1.0rem;
	font-size: 0.9rem;
	text-align: left;
}

h1, h2, h3 {
	font-family: 'Dalli', 'Baskerville', 'Baskerville Old Face', 'Hoefler Text', 'Garamond', 'Times New Roman', Georgia, serif;
	font-weight: normal;
	line-height: 1.0em;
	letter-spacing: 0.02em;
	text-transform: none;
	text-align: center;
	color: hsl(50, 40%, 60%);
}

	h1 {
		margin: 0 0 0.25em;
		font-size: 3.0rem;
	}
	
	h2 {
		margin: 0 0 0.5em;
		font-size: 1.8rem;
	}
	
	h3 {
		margin: 0 0 1.0em;
		font-size: 1.1rem;
/* 		font-style: italic; */
/* 		line-height: 1.3em; */
/* 		letter-spacing: 0; */
/* 		color: hsl(50, 40%, 100%); */
	}

hr {
	clear: both;
	width: 100%;
	height: 0;
	margin: 0 auto 0.6em;
	background: transparent;
	border: none;
	border-top: 1px solid hsl(50, 40%, 60%);
}

a:link,
a:visited {
	display: inline-block;
	color: currentColor;
	text-decoration: none;
}

	a:hover,
	a:active,
	a:focus {
		color: hsl(50, 40%, 60%);
/* 		text-decoration: none; */
	}

img {
	display: block;
	width: 100%;
	height: auto;
	border: none;
}

input,
textarea,
select {
	margin: 0;
	padding: 0;
	border: none;
	font-size: 1.0rem;
}

/* @end */



/* @group --- STICKY FOOTER + WRAPPERS + RESPONSIVE TYPE ---*/

html {
	position: relative;
	min-height: 100%;
	background: hsl(210, 30%, 0%) url('/img/common/bg-lace.png') center top repeat fixed;
	font-size: 16px;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
}
	@media screen and (min-width: 320px) { html { font-size: calc(16px + (34 - 16) * ((100vw - 320px) / (1600 - 320))); } }
	@media screen and (min-width: 1600px) { html { font-size: 34px; } }

body {
	min-height: 100%;
/* 			background: hsla(220, 10%, 80%, 0.05); */
}

main {
	padding-bottom: 14rem;
/* 			background: hsla(300, 80%, 50%, 0.2); */
}

div#wrapHeader {
	background-image: linear-gradient( 0deg, hsla(210, 50%, 0%, 0.1), hsla(210, 50%, 50%, 0.2) 0.3rem, hsla(210, 50%, 50%, 0.35) );
/* 			background: hsla(100, 30%, 50%, 0.2); */
}

div#wrapFooter {
	position: absolute;
	overflow: hidden;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 14rem;
	background-image: linear-gradient( 180deg, hsla(210, 50%, 0%, 0.3), hsla(210, 50%, 50%, 0.35) 0.3rem, hsla(210, 50%, 50%, 0.2) );
/* 			background: hsla(200, 30%, 50%, 0.2); */
}

section#Announcement {
	--colorHighlight: 50, 40%, 50%;
	
	background-image: linear-gradient( 180deg, hsla(var(--colorHighlight), 0.1), hsla(var(--colorHighlight), 0.35) 0.8rem, hsla(var(--colorHighlight), 0.2) 60%, hsla(var(--colorHighlight), 0.0) 60% ), linear-gradient( 0deg, hsla(var(--colorHighlight), 0.1), hsla(var(--colorHighlight), 0.2) 0.3rem, hsla(var(--colorHighlight), 0.2) 40%, hsla(var(--colorHighlight), 0.0) 40% );
}

section#Feature {
	background-image: linear-gradient( 180deg, hsla(260, 30%, 40%, 0.1), hsla(260, 30%, 50%, 0.35) 0.8rem, hsla(260, 30%, 50%, 0.2) 60%, hsla(260, 30%, 50%, 0.0) 60% ), linear-gradient( 0deg, hsla(260, 30%, 0%, 0.1), hsla(260, 30%, 50%, 0.2) 0.3rem, hsla(260, 30%, 50%, 0.2) 40%, hsla(260, 30%, 50%, 0.0) 40% );
}

section#Content {
	--wCon-color: 310;
	background-image:
		linear-gradient( 180deg, hsla(var(--wCon-color), 30%, 30%, 0.2), hsla(var(--wCon-color), 30%, 40%, 0.35) 0.8rem, hsla(var(--wCon-color), 30%, 40%, 0.2) 60%, hsla(var(--wCon-color), 30%, 40%, 0.0) 60% ),
		linear-gradient( 0deg, hsla(var(--wCon-color), 30%, 0%, 0.1), hsla(var(--wCon-color), 30%, 40%, 0.2) 0.3rem, hsla(var(--wCon-color), 30%, 40%, 0.2) 40%, hsla(var(--wCon-color), 30%, 40%, 0.0) 40% );
}

section#Contact {
	background-image: linear-gradient( 180deg, hsla(210, 0%, 0%, 0.8), hsla(210, 0%, 0%, 0.4) 0.8rem, hsla(210, 0%, 0%, 0.0) 60%, hsla(210, 0%, 0%, 0.0) );
}

header,
section,
footer {
	display: block;
	position: relative;
	max-width: 1600px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 0.5rem;
	padding-right: 0.5rem;
}

/* @end */



/* @group --- HEADER ---*/

header {
	padding-top: 1.8rem;
	padding-bottom: 1.0rem;
/* 			background: hsla(20, 50%, 50%, 0.2); */
}

	#logo {
		box-sizing: content-box;
		position: relative;
	}


	#logo > a {
		display: block;
/* 				background: hsla(90, 50%, 50%, 0.2); */
	}
	
		#logo > a > svg {
			overflow: visible;
			width: 100%;
			height: 1px;
			margin: 0;
/* 					background: hsla(150, 50%, 50%, 0.2); */
		}

/* @end */



/* @group --- CONTENT ---*/

section {
	max-width: none;
	padding: 0;
/* 			background: hsla(300, 50%, 50%, 0.2); */
}

	section article {
		max-width: 1600px;
		margin-left: auto;
		margin-right: auto;
		padding: 1.2rem 0.5rem 0.4rem;
/* 				background: hsla(100, 50%, 50%, 0.2); */
	}
	
		section article.full {
			max-width: none;
			padding: 1.2rem 0.0rem 0.2rem;
		}
	
	section h2 span { font-size: 0.7em;	}
	
	section img { margin-bottom: 1.0rem; }

	section ul li { margin-bottom: 1.0rem; }
	
	
	
	section#Announcement article .eventImage {
		overflow: hidden;
		margin-bottom: 1.0rem;
		border-radius: 1.0rem;
		line-height: 0;
	}
		
		section#Announcement article .eventImage img {
			margin: 0;
			border-radius: 1.0rem;
	}
		
			section#Announcement article .eventImage:hover { background-color: currentColor; }
				
				section#Announcement article .eventImage:hover img { opacity: 0.7; }
	
	section#Announcement article .eventHeader p {
		margin-bottom: 0.9rem;
		padding-top: 0.4rem;
		color: hsl(50, 40%, 60%);
		font-size: 0.85rem;
		line-height: 1.3em;
		text-align: center;
	}
	
	section#Announcement article .eventInfo p {
		margin-bottom: 0.9rem;
		font-size: 0.6rem;
		line-height: 1.6em;
	}
	
	section#Announcement article .eventCTA { text-align: center; }
	
		section#Announcement article .eventCTA a { font-size: 0.85rem; }
	
/* @end */



/* @group --- FOOTER ---*/

footer {
	padding-top: 1.0rem;
	padding-bottom: 1.0rem;
	background: url('/img/common/logo-It'sTaraMae'd_icon.svg') 90% 1.2rem no-repeat;
	background-size: auto 8.3rem;
	font-size: 0.8rem;
	line-height: 1.8rem;
	word-spacing: 0.1rem;
/* 			background: hsla(50, 50%, 50%, 0.1); */
}

	footer > div {
		display: block;
		position: relative;
	}

	footer p.copyright {
		margin-top: 1.2em;
		margin-bottom: 0.4rem;
		font-size: 0.7rem;
	}
	
	footer p.dawg {
		margin-bottom: 0;
		font-size: 0.4rem;
	}

	.fb-like { float: right; }

/* @end */



/* @group --- CLASSES | Various ---*/

.note {
	font-size: 0.8rem;
	font-style: italic;
	text-align: center;
}

.bullet {
	display: inline-block;
	width: 1.4em;
	background: url('/img/common/logo-It'sTaraMae'd_icon.svg') center top no-repeat;
	background-size: auto 1.4em;
/* 			background: hsla(50, 50%, 50%, 0.1); */
}

.button {
	display: inline-block;
	margin: 1.0em auto 1.0em;
	padding: 0.6em;
	background: hsla(50, 40%, 60%, 0.7);
	border-radius: 0.6rem;
	color: hsl(50, 40%, 20%) !important;
	font-size: 1.1rem;
	font-weight: bold;
	letter-spacing: 0.1em;
	text-align: center;
	text-transform: uppercase;
	cursor: pointer;
}

	.button:hover { color: hsl(50, 40%, 100%); }


/*
.fancy,
span.dropcap {
	font-family: 'Dalli', Georgia, serif;
	font-size: 1.8em;
	line-height: 1.4em;
}

	span.dropcap {
		font-style: italic;
		line-height: 1.0em;
	}
*/

/* @end */



/* @group --- ICONS ---*/
	
svg.icon {
	display: inline-block;
	width: 1.3em;
	height: 1.3em;
	margin-bottom: 0.2em;
	margin-right: 0.7em;
	vertical-align: middle;
}

	h2 svg.icon {
		width: 1.0em;
		margin-right: 0.3em;
	}
	
/* @end */



/* @group --- CONTENT | Galleries ---*/

.gallery,
.galleryMenu > div,
.galleryRect > div {
	position: relative;
	overflow: hidden;
	padding-bottom: 21.5%;
	background-color: currentColor;
	border-radius: 1.0rem;
		transform: translateY(0); /* Corner Radius Mask fix for Chrome */
}

	.galleryMenu > div {
		padding-bottom: 70%;
	}

	.galleryRect > div {
		padding-bottom: 130%;
	}

	.gallery > img,
	.galleryMenu > div > img,
	.galleryRect > div > img {
		position: absolute;
		min-height: 100%;
		min-width: 100%;
		max-width: 150%;
		margin: 0;
	}

		.galleryMenu > div > img {
/* 			left: 0; */
/* 			max-width: 101%; */
		}

		.galleryRect > div > img {
/* 			left: 0; */
			max-width: 200%;
		}

			a.gallery:hover > div,
			a.galleryMenu:hover > div,
			a.galleryRect:hover > div { background-color: currentColor; }
	
				a.gallery:hover > div > img,
				a.galleryMenu:hover > div > img,
				a.galleryRect:hover > div > img { opacity: 0.7; }

	.galleryMenu > h3,
	.galleryRect > h3 {
		display: block;
		min-height: 2.5em;
		margin-top: 0.5em;
		line-height: 1.0em;
		text-align: left;
	}

		.galleryMenu > h3 > span,
		.galleryRect > h3 > span {
			float: right;
			padding: 0.25em 0.3em 0.1em;
			background: hsl(50, 40%, 60%);
			border-radius: 0.4rem;
			color: white;
			text-align: center;
		}

/* @end */



/* @group --- MODULES ---*/
	
body#home .homeSwiper a {
	display: block;
}

	body#home .homeSwiper h2 {
		margin-top: 0.5em;
	}

		body#home .homeSwiper:first-child h2 {
			margin-top: 0.5em;
			margin-bottom: 0.1em;
/* 					background: hsla(50, 50%, 50%, 0.1); */
		}


iframe.lightwidget {
	overflow: hidden;
	width: 100%;
	border: 0;
	box-shadow: 0 0 0.5rem hsla(0, 0%, 0%, 0.5);
}


div.paypal_button input:hover {
	opacity: 0.6;
}


/* body#home .swiper-container { border: 3px solid red; } */


/* @end */



				/* @group --- BASIC IMAGE CYCLER ---*/
				
/*
				#cycler {position: relative;}
				
					#cycler img {
						z-index: 1;
						position: absolute;
					}
					
						#cycler img.active {z-index: 3}
*/
				
				/* @end */




/* @group --- DEBUGGERY ---*/
	
#debugScroll {
	z-index: 500;
	display: block;
	display: none;
	position: fixed;
	bottom: 0;
	right: 0.7rem;
	padding: 0.0rem 0.3rem;
	background: hsla(var(--colorHighlight), 0.2);
	border-radius: 50%;
	color: white;
	font-size: 0.4rem;
	font-weight: bold;
}

/* @end */



/* @group Clearfix (2016) */

.clearfix:after {
	content: "";
	display: block;
	clear: both;
}

/* @end */
