/* 
	Author: Michelle C. Basey
	Project: michellebasey.com
	Purpose: CSS Delarations & Includes

	Notes: declare variables, include fonts

*/
/*	=== Key for height/width naming convention:
	ele element (elew width of the element ...)		img image
	pad padding (padh height of the padding ...)	logo 
	brd border (same w/h convention)
	mar margin (same w/h convention)
 */
/* ============ DECLARATIONS ============ */

:root {		

	/* ~~~~~~~~~ url's (decorative textures) ~~~~~~~~~ */

				/* UNUSED IN CURRENT ITERATION */

	/* ~~~~~~~~~ Fonts ~~~~~~~~~ */

	--font_global: Aperto;
	--font_contrast1: EBGar;
	--font_contrast2: CooperplateGC;
	--font_fancy1: CWMagik;
	--font_fancy2: oakwood;

	--fontSize_fancyFont1: 1.4em;
	--fontSize_fancyFont2: 1.5em;

	--brdColor_global: goldenrod;
	--brdw_global: .2em;

	/* ~~~~~~~~~~~~ Page Header ~~~~~~~~~~~~ */

	--padw_logo: 1em;
	--marh_logoMenu: .4em;

	--imgh_logo: 57px;
	--imgw_logo: 91px;

	--textColor_essence: #4e2a75;
	--textShadow_essence: -0.014em -.012em 0px #fcdb8d;
	--fontSize_essence: 2.5em;

	--img_menuGlobal: url("/core/styles/files/Logo2.png");
	--imgw_menuGlobal: 112px;
	--imgh_menuGlobal: 105px;

	--textColor_menuGlobal: #21fffe;

	--brdStyle_menuGlobal: inset;

	--fontSize_leadin: 1em;
	--marw_leadin: 10%;
	--marw_leadinSm: 5%;
	--marw_leadinLg: 25%;


	/* ~~~~~~~~~~~~ Page Footer ~~~~~~~~~~~~ */

	--textColor_footer: #e0aa3e;

	--fontSize_footer: 12px;
	--pad_footer: .05%;


	/* ~~~~~~~~~~~~ Landing ~~~~~~~~~~~~ */
/* !!! STILL LOTS OF HARDCODED VALUES (land.css) !!! */

	/* ~~~ colors galore ~~~ */

	--backgroundColor_global: #310d56;
	--backgroundColor_contrast: #81539e;

	--textColor_global: #d7bee8;
	--textColor_contrast: ivory;
	--textColor_logo: #d6a8ea;

	/* ~~~ Menu ~~~ */

	--marh_menuRing: 4em;
	--marh_menuRingAlt: 1em;

	--padh_menuLand: 3em;
	--padw_menuLand: .5em;

	--brdw_menuLand: .1em;
	--brdStyle_menuLand: hidden double;
	--brdStyle_hoverMenuLand: groove hidden double;

	--marh_menuLand: 3em;
	--marw_menuLand: .5em;


	/* ~~~~~~~~~~~~ Galleries ~~~~~~~~~~~~ */
	
	--backgroundColor_gallery: ivory;
	--brdStyle_gallery: outset;

	--backgroundColor_galleryOfSong: #0B0316;
	--brdw_galleryOfSong: 3px;
	--padh_galleryOfSong: 5%;


	--backgroundColor_galleryOfProse: #4e2a75;
	--textColor_proseParaSilver: silver;

	--brdStyle_galleryOfProse: solid;
	--brdw_galleryOfProse: 3em;
	--brdh_galleryOfProse_btmOnly: 1em;
	--brdw_galleryOfProse_mobile: 0em; /* it breaks if I remove this */

	--padw_galleryOfProse: 10%;
	--padw_galleryOfProse_mobile: 3%;

	--mar_galleryOfProse_mobile: 1em;


	--brdw_albumSong: 3px;
	--brdStyle_albumSong: inset;

	--marTop_art_albumSong: 5%;
	--marRest_art: 5%;
	--marRest_albumSong: 1%;

	--brdStyle_galleryOfProse_frameHeading: ridge groove groove ridge;
	--brdRadius_galleryOfProse_frameHeading: 50%;
	--pad_galleryOfProse_framHeading: 1.6em;
	--pad_galleryOfProse_frameHeading_mobile: 2em;


	--mar_innerProseHeading: 1%;

	--textColor_innerProseHeading_pt2: #e8a509;
	--mar_innerProseHeading_ptAll: .25em; 
	--mar_innerProseHeading_pt3top: .0em; 

	--brdw_hoverWrapArt: 1px;
	--brdStyle_hoverWrapArt: outset;

	--pad_hoverWrapArt: 17%;
	--pad_hoverWrapArt_safari: 12%;
	--pad_hoverWrapArt_mobile: 2%;

	/* check gallery.css - intentional hard coded values */

}


/* ============ INCLUDES ============ */

@font-face {
	font-family: Aperto;
	src: url(./fonts/LinotypeAperto_SemiBold.ttf);
}
@font-face {
	font-family: EBGar;
	src: url("./fonts/EBGaramond-Regular.woff2"),
		url("./fonts/EBGaramond-Medium.woff2"),
		url("./fonts/EBGaramond-MediumItalic.woff2"), 
		url("./fonts/EBGaramond-Italic.woff2"),
		url("./fonts/EBGaramond-BoldItalic.woff2"),
		url("./fonts/EBGaramond-ExtraBoldItalic.woff2"),
		url("./fonts/EBGaramond-SemiBoldItalic.woff2"),
		url("./fonts/EBGaramond-Bold.woff2"), 
		url("./fonts/EBGaramond-ExtraBold.woff2"),
		url("./fonts/EBGaramond-SemiBold.woff2");
}
@font-face {
	font-family: CopperplateGC;
	src: url("./fonts/Copperplate Gothic Condensed BT.ttf");
}
@font-face {
	font-family: CWMagik;
	src: url(./fonts/CWMAGIK_.TTF);
}
@font-face {
	font-family: oakwood;
	src: url(./fonts/OAKWOOD_.TTF);
}