/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v7.0.29,
* Autoprefixer: v9.7.6
* Browsers: last 4 version
*/

body{
	background-color: rgba(165,238,237,0.41) !important;
	margin: 0;
}

.body-wrapper > *:nth-child(1){
	-ms-grid-row: 1;
	-ms-grid-column: 1;
}

.body-wrapper > *:nth-child(2){
	-ms-grid-row: 2;
	-ms-grid-column: 1;
}

#quote-all-container{
	position: relative;
	height: 100%;
	width: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}

#quote-wrapper{
	height: 60%;
	width: 50%;
	min-width: 170px;
	min-height: 300px;
}

#button-container{
	width: 100%;
	height: 20%;
}

#random-btn{
	width: 85%;
	height: 50%;
	max-width: 300px;
	background: rgba(0,180,255,1);
	-webkit-box-shadow: 3px 7px 8px 4px rgba(0,0,0,0.3);
	        box-shadow: 3px 7px 8px 4px rgba(0,0,0,0.3);
	margin: 0 auto;
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	    -ms-transform: translateY(-50%);
	        transform: translateY(-50%);
	overflow: hidden;
}

#random-btn:hover{
	cursor: pointer;
}

#random-btn-text{
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	    -ms-transform: translateY(-50%);
	        transform: translateY(-50%);
	margin: 0;
	color: white;
	text-align: center;
	font-family: 'Little Miss Loudonbold';
	font-size: 1.15em;
}

#content-container{
	width: 100%;
	height: 80%;
}

#quote-container{
	height: 100%;
	width: 100%;
}

#quote-text{
	-webkit-transition: opacity 1s;
	-o-transition: opacity 1s;
	transition: opacity 1s;
	font-family: 'EB Garamond', serif;
	font-size: 1.25rem;
}

#quote-author{
	text-align: right;
	-webkit-transition: opacity 1.3s;
	-o-transition: opacity 1.3s;
	transition: opacity 1.3s;
	margin-right: 5px;
	font-family: 'EB Garamond', serif;
	font-style: italic;
}