#quotes {
	margin: 0;
	font-size:xx-large;
	padding: 20px;
}
.textItem {
	display: none;
	text-align:center;
	width:90%;
	
	/**********************************/
	color:white;
	padding:20px;
	display:block;
	text-shadow:1px 1px 0 #145982;
	font-family: sans-serif;
	font-weight:bold;
	text-align:center;
	width:90%;

	margin:60px auto;
	/*
		CSS3 gradients for webkit and mozilla browsers,
		fallback color for the rest:
	*/	
	/*background-color: #59aada;*/
	/*background-image: -moz-linear-gradient(#5eb2e2, #4f9cca);*/
	/*background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#5eb2e2), to(#4f9cca));*/
}
#quotes > .current {
	width:90%;
}
/************************************************/
*{
	/* A universal page reset */
	margin:0;
	padding:0;
}

body{
	/* Setting default text color, background and a font stack */
	font-size:14px;
	color:#fcfcfc;
	background-color: #000;
	font-family:Arial, Helvetica, sans-serif;
}

#main, #quotes, .textItem, .button{
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
}

/* Styling the big button */

a.button,
a.button:visited,
a.button:active{
	color:white;
	/*letter-spacing:-2px;*/
	padding:20px;
	display:block;
	text-shadow:1px 1px 0 #145982;
	font-family: sans-serif;
	font-size:5em;
	font-weight:bold;
	text-align:center;
	width:90%;
	border:1px solid #60b4e5;
	margin:60px auto;
	/*
		CSS3 gradients for webkit and mozilla browsers,
		fallback color for the rest:
	*/	
	background-color: #59aada;
	background-image: -moz-linear-gradient(#5eb2e2, #4f9cca);
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#5eb2e2), to(#4f9cca));
}

/* Only needed for the display page */
#main{
	background-color: #000;
	height:400px;
	margin: 2% auto 50px;
	padding:0px 30px 0;
	position:relative;
	width:80%;
}

#main p{
	color:#ccc;
	font-size:19px;
	line-height:1.4;
	margin-bottom:20px;
	text-align:center;
}

#main p strong{
	color:white;
}

h1{
	padding:30px 0;
	text-align:center;
	text-shadow:0 1px 1px black;
	margin-bottom:30px;
	font-size:24px;
	font-family:"Myriad Pro",Arial,Helvetica,sans-serif;
}

a, a:visited {
	color:#0196e3;
	text-decoration:none;
	outline:none;
}
html { font-size: 62.5%; }
body { font-size: 1em;}

@media (max-width: 300px) {
    html { font-size: 70%; }
	.textItem { font-size: 100%; }
}

@media (min-width: 500px) {
    html { font-size: 80%; }
	.textItem { font-size: 1200%; }
}

@media (min-width: 700px) {
    html { font-size: 120%; }
	.textItem { font-size: 900%; }
}

@media (min-width: 1200px) {
    html { font-size: 200%; }
	.textItem { font-size: 1200%; }
}