@import url('https://fonts.googleapis.com/css2?family=Monoton&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Monoton&family=Yellowtail&display=swap');

body
	{
		background-image: url('../assets/hearts.png');
		margin: 0;
    }

html
    {
        margin: 0;
    }

label, input
	{
		display: inline;
	}

label, aside
	{
		font-size: medium;
	}

input:invalid:required, select:invalid:required
	{
		border: 1px solid red;
	}

fieldset
	{
		display: block;
		clear: both;
		font-size: medium;
		background-image: url('../assets/paper.png');
		background-repeat: repeat;
		margin-left: 1em;
	}

aside button
	{
		margin-left: 1em;
    }
      
fieldset#dm2 input
	{
		display: inline;
	}
	
fieldset#dm2 label
	{
		display: block;
	}

hgroup#title
	{
		text-align: center;
	}

aside#pform
	{
		display: block;
		float: left;
		width: 25%;
		padding: 0;
		margin: 0;
	}

section#pamphlet
	{
		display: block;
		float: right;
		width: 74%;
	}

section.pamphlet-container
	{
		overflow-x: auto;
		width: 100%;
		transform: rotateX(180deg);
	}
		
@media (max-width: 1024px)
	{
		aside#pform, section#pamphlet
		{
			display: block;
			float: none;
			width: 100%;
			padding: 0;
			clear: both;
		}
	h1
		{
			font-size: 8vw !important;
		}
	h2
		{
			font-size: 7vw !important;
		}
		
	}

ul#rev-history
	{
		font-size: small;
	}

fieldset
	{
		border: 0.1em inset #000;
	}

textarea
	{
		width: 99%;
	}

section#pamphlet-1, section#pamphlet-2
	{
		border: 1px solid #000;
		margin-bottom: 1em;
		overflow-y: hidden;
		min-height: 8.5in;
		-webkit-box-shadow: 5px 5px 10px 3px #000000; 
		box-shadow: 5px 5px 10px 3px #000000;
		background-color: #FFFFFF;
		padding-top: 0.5em;
		padding-bottom: 5em;
		padding-left: 0.75em;
		padding-right: 0.75em;
		min-width: 11in;
		transform: rotateX(180deg);
	}

footer
	{
		clear: both;
		width: 100%;
		display: block;
		background: #A1514D;
		background: linear-gradient(180deg,rgba(0, 0, 0, 0) 1%, rgba(161, 81, 77, 1) 100%);
		padding-top: 0.5em;
		padding-bottom: 0.5em;
		margin: 0;
		text-align: center;
	}

footer ul
	{
		text-align: left;
	}

button#rev-hide, button#send-hide, button#privacy-hide
	{
		box-shadow: inset 0em 0.12em 0.3em 0em #D1AEB3;
		background: linear-gradient(to bottom, #C0777E 5%, #B97C7C 100%);
		background-color: #C0777E;
		border-radius: 0.5em;
		border: 0.01em solid #C36963;
		display: inline-block;
		cursor:pointer;
		color:#ffffff;
		padding: 1em 1.5em;
		text-decoration:none;
		text-shadow: 0em -0.1em 0em #2b665e;
	}

button#rev-hide:hover, button#send-hide:hover, button#privacy-hide:hover
	{
		background:linear-gradient(to bottom, #9F7777 5%, #C0777E 100%);
		background-color:#B97C7C;
	}

button#rev-hide:active, button#send-hide:active, button#privacy-hide:active
	{
		position:relative;
		top: 0.01em;
	}

h1
	{
		font-family: "Monoton", sans-serif;
		font-weight: normal;
		font-size: 4vw;
		margin: 0;
		color: #A1514D;
		text-shadow: 0 0 5px #A1514D;
	}

h1::after
	{
		content: "\2764";
		padding-right: 0.5em;
		color: #A1514D;
		text-shadow: 0 0 5px #A1514D;
    }

hgroup#title p
	{
		display: none;
    }

h2#preview, aside#pform h2
	{
		color: #A1514D;
		font-family: "Yellowtail", cursive;
		font-size: 2.5vw;
		font-weight: normal;
		margin: 0;
    }

h3
	{
		margin-bottom: 0;
    }

#a11
    {
        display: none;
    }

form#contact input, form#contact textarea, div.g-recaptcha
    {
        font-family: Calibri, sans-serif;
        font-size: medium;   
        opacity: 0.8;
    }

form#contact textarea
    {
        width: 95%;
        display: block;
        margin: 0.5em auto;
    }

ul#rev-history
    {
		overflow: auto;
		width: 88%;
		height: 20em;
		margin: 0 auto;
		background-color: rgba(255, 255, 255, 0.3);
	}

section#privacy
    {
		overflow: auto;
		width: 92.5%;
		height: 20em;
		margin: 0 auto;
		background-color: rgba(255, 255, 255, 0.3);
		text-align: left;
	}

@media (min-width: 768px)
	{
	ul#rev-history, section#privacy
		{
			width: 50%;
		}
	form#contact textarea
		{
			width: 31.4em;
		}