/* test_diag.css */
/* Ashley Mayer */
/* December, 2017 */

/* *** SELECTORS *** */
/* */
/* Element selector: p */
/* ID selector: #wrapper */
/* class selector: .centre */
/* Only specific elements to be affected by class: p,centre */
/* Group selectors: h1, h2, p {} */
/* % unit does not work for min-height, rather use vh*/
/* For stick footers see: */
/* https://stackoverflow.com/questions/30721201/sticky-footer-with-purecss */
/* https://www.ibm.com/blogs/bluemix/2016/11/pure-css-sticky-footers/ */

*
{
	/* box-sizing sets the width to include padding and border */
	/* box-sizing does not have margins */
	box-sizing:				border-box;
}

html, button, input, select, textarea,
    .pure-g [class *= "pure-u"] {
        /* Set your content font stack here: */
        font-family: Arial,"Helvetica Neue",Helvetica,sans-serif;
}

body{
	/*background-image		: url("/img/paper-1074131_960_720.jpg");*/
	background-image		: url("/img/cream_paper.jpg");
	background-repeat		: repeat;
	background-size			: cover;
}

/* Added 01.01.19 */
html, body{
	height:					100%;
	width:					100%;
	margin:					0px;
}

#page{
	width:					100%;
	min-height:				100%;
	padding-bottom: 		8vh; /* must be same as footer height */
}

#header{
	height: auto;
	/*height					: 38vh;*/
	/*border					: solid 1px black;*/
	padding-right: 3vw;
}


/*.content_bar{*/
	/*height					: auto;*/
	/*min-height					: 52vh;*/
	/*border					: solid 1px black;*/
/*}*/


#footer{
	background-image		: url("/img/cream_paper.jpg");
	background-repeat		: repeat;
	background-size			: cover;
	width: 100%;
	height: 8vh;
	position: fixed;
	padding: 0 3vw 0 1vw;
	/*left: 0px;*/
	bottom: 0px;
	/*background-color: white;*/
	font-size: 2vh;
	/*background: rgba(255, 255, 255, 1);*/
	border-top: 1px solid;
	border-top-color: linen;
}

/*#main-buttons{*/
	/*width: auto;
	height: auto;*/
	/*min-height: 25vh;*/
	/*border: 5px solid red;*/
	/*border-right-color: lightgray;*/
	/*border-right-width: 2px;*/
	/*border-right-style: solid;*/
	/*padding: 10px;*/
	/*background: rgba(255, 255, 255, 0.2);*/
/*}*/

#main-content{
	/*margin: auto 5%;*/
	padding: 0 2vw;
	/*border-top-color: lightgray;*/
	/*border-top-width: 2px;*/
	/*border-top-style: solid;*/
}

 .subscr_form{
	width					: auto;
	height					: auto;
	/*min-height				: 25vh;*/
	/*border					: 5px solid red;*/
	padding					: 10px;
 }
 
 .hidden{
	display: none;
 }

#quote_date{
	width: 100%;
}

#quote_title{
	margin: auto;
}

#quote_text{
	margin: auto;
}

#subscr_info, #unsubscr_info, #subscr_email_error, #unsubscr_email_error{
	color: black;
} 

#subcfm_info, #unsubcfm_info{
	padding: 3vh 0;
}

h1{
	font-family: 'Allura', cursive;
	font-size: 6vw;
	color: blue;
	font-weight: bold;
	line-height: 7vw;
	padding: 0;
	margin: 0 2vh;
}

h2
{
	font-family				: Arial;
	font-size				: 1.2em;
	line-height				: 1.8em;
	color					: black;
	text-align				: center;
}

p
{
	font-family				: Arial;
	font-size				: 1.0em;
	line-height				: 1.5em;
	color					: black;
	text-align				: left;
}


/*#title-img{*/
	/*width					: 100%;*/
	/*height					: 100%;*/
	/*object-fit				: contain;*/
	
	/*padding-left: 2vh;*/
	/*padding-top: 2vh;*/


	/*box-shadow: 5px 5px 3px darkgray;*/
/*}*/

.image-container{
	padding-top: 2vh;
	padding-left: 2vh;
}

.image-box{
	border-top-color: white;
	border-top-width: 1px;
	border-top-style: solid;
	border-left-color: white;
	border-left-width: 1px;
	border-left-style: solid;
	border-radius: 15px;
	box-shadow: 5px 5px 3px lightgray;
}

#img{
	border-radius: 3%;
}



.button-container{
	width: 100%;
	/*height: 10vh;*/
	/*margin: 30px auto;*/
	padding: 2vh 0;
	text-align: center;
	/*border: 1px solid black;*/
}

.stories-button{
	width: 22vw;
	/*Min size 10px, mas sixe 18px, min screen size 300px, max size 800px*/
	font-size: calc(10px + (18 - 10) * ((100vw - 300px) / (1600 - 300)));
	/*https://css-tricks.com/books/volume-i/scale-typography-screen-size/*/
	padding: 2vh;
	box-shadow: 5px 5px 3px darkgray;
}
.clear
{
	clear: both;
}

.left_align{
	text-align: left;
}

.right_align
{
	text-align: right;
}

.center{
	text-align: center;
}

.hide{
	display				: none;
}

#text-container{
	padding: 0.5vh 1vw;;
	border-top-color: white;
	border-top-width: 1px;
	border-top-style: solid;
	border-left-color: white;
	border-left-width: 1px;
	border-left-style: solid;
	border-radius: 15px;
	box-shadow: 5px 5px 3px lightgray;
	background: rgba(255, 255, 255, 0.1);
}

#invite{
	padding: 0 5vw;
}

#quotetitle
{
	/*width					: 80%;*/
	margin					: auto;
	text-align				: center;
	line-height				: 48px;
}

#quotetext
{
	/*width: 90%;*/
	margin: auto;
	text-align: center;
	/*padding: 10px 10px;*/
	line-height: 24px;
}

label{
	padding: 10px;
}

#copyright{
	margin: 0 5vw; 
	padding: 0.5vh 1vw;;
	border-top-color: white;
	border-top-width: 1px;
	border-top-style: solid;
	border-left-color: white;
	border-left-width: 1px;
	border-left-style: solid;
	border-radius: 15px;
	box-shadow: 5px 5px 3px lightgray;
	background: rgba(255, 255, 255, 0.1);
}