body{
font-family:raleway,arial;
line-height: 175%;
letter-spacing: 2px;
color:white;
background-color:#222;
background: url(http://i.imgur.com/dekGGB3.jpg);
background-attachment:fixed;
background-repeat:no-repeat;
  -webkit-background-size:cover;
  -moz-background-size:cover;
  -o-background-size:cover;
  background-size:cover;
margin:0;
font-size: 20px;
}

h1,h2,h3,h4,h5{
font-family:"PT Sans";
}

#header{
background-color: rgba(0, 0, 0, 0.3);
}
header{
margin:auto;
max-width:800px;
}

#article{
background-color: rgba(0, 0, 0, 0.7);
}
article{
padding: 5px 30px 60px 30px;
color: white;
margin: auto;
max-width: 800px;
min-height: 230px;
}

#intro{
}

#getstarted div{
color:#FFAC19;
font-size:25px;
margin-bottom:20px;
}

#getstarted p{
margin: 2px 2px 2px 95px;
color: grey;
font-size: 14px;
font-family: arial;
}

#footer{
padding:5px;
margin:auto;
max-width:800px;
letter-spacing: 3px;
font-family: arial;
}

footer{
font-size: 12px;
letter-spacing: 4px;
background-color: rgba(0, 0, 0, 0.3);
bottom: 0px;
width: 100%;
}

a{
color:#FFAC19;

}

#gsbutton{
line-height: initial;
height: 25px;
margin: 10px;
padding: 10px;
float:right;
border:2px solid white;
font-weight:bold;
font-family: 'PT Sans', sans-serif;
font-size: 20px;
color: #ffffff;
background: -moz-linear-gradient(
 top,
 #FFAC19 0%,
 #CF5B00);
background: -webkit-gradient( linear, left top, left bottom, from(#FFAC19), to(#CF5B00));
-moz-border-radius: 30px;
-webkit-border-radius: 30px;
border-radius: 18px;
-moz-box-shadow: 1px 1px 1px rgba(000,000,000,0.8),
 inset 0px 0px 1px rgba(255,255,255,0.7);
-webkit-box-shadow: 1px 1px 1px rgba(000,000,000,0.8),
 inset 0px 0px 1px rgba(255,255,255,0.7);
box-shadow: 1px 1px 20px rgba(000,000,000,1), inset 0px 0px 1px rgba(255,255,255,.5), 0px 4px 0px 1px rgb(133, 133, 133);
  text-shadow:
   -1px -1px 0 rgba(0, 0, 0, 0.2),  
    1px -1px 0 rgba(0, 0, 0, 0.2),
    -1px 1px 0 rgba(0, 0, 0, 0.2),
     1px 1px 0 rgba(0, 0, 0, 0.2),
	 0 0 5px black;
}

#gsbutton:hover{
background:-webkit-gradient( linear, left top, left bottom, from(#19ACFF), to(#00608D));
}

		#makeMeScrollable{
			width: 96%;
			height: 330px;
			position: absolute;
			left: 2%;
			box-shadow: 0 5px 15px 5px black;
			background-color:white;
		}
		
		#makeMeScrollable div.scrollableArea a
		{
			position: relative;
			float: left;
			margin: 0;
			padding: 0;
			/* If you don't want the images in the scroller to be selectable, try the following
			   block of code. It's just a nice feature that prevent the images from
			   accidentally becoming selected/inverted when the user interacts with the scroller. */
			-webkit-user-select: none;
			-khtml-user-select: none;
			-moz-user-select: none;
			-o-user-select: none;
			user-select: none;
		}
		
		#makeMeScrollable div.scrollableArea img {
		height:330px;
		}
		
.scrollableArea img:hover {
opacity: 0.9 !important;
}
