*{margin:0;padding:0}
*,:after,:before{box-sizing:inherit}
html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box}
body{font-size:100%;font-family:'Open Sans',sans-serif;background:url('small_steps.png');}
article,section{display:block;background:#fff}
article{
height:auto;
width:60%;margin:0 auto;
}
section{width:100%;float:left;padding-bottom:1em;padding-top:1em}
a{background-color:transparent;text-decoration:none;color:#27ae60}
a:hover{color:#2ecc71}
h1{font-size:3em;text-align:center;padding:1em 2em 1em 2em;font-family: 'Roboto', sans-serif;}
h2,h3{font-size:1.5em;font-family: 'Roboto', sans-serif;padding:0 2em 0.75em 1em}
strong{font-weight:bold}
img{border:0;max-width:100%;height:auto}
textarea{display:block;font-family:monospace,monospace;width:70%;margin:0 auto;overflow:auto;padding:1em}
input,textarea{color:inherit;outline:none}
input[type=text]{
width:80%;
float:left;
border:0;
background:transparent;
font-size: 20px;
padding: 15px 20px 15px 20px;
text-decoration: none;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,e8e8e8+100 */
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(232,232,232,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(232,232,232,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(232,232,232,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e8e8e8',GradientType=0 ); /* IE6-9 */

}
input[type=submit]{
width:20%;
float:right;
-webkit-appearance:button;cursor:pointer;
background: #3498db;
background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
background-image: -moz-linear-gradient(top, #3498db, #2980b9);
background-image: -ms-linear-gradient(top, #3498db, #2980b9);
background-image: -o-linear-gradient(top, #3498db, #2980b9);
background-image: linear-gradient(to bottom, #3498db, #2980b9);
border:0;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0px;
color: #ffffff;
font-size: 20px;
padding: 15px 20px 15px 20px;
text-decoration: none;
}
input[type=submit]:hover{
border:0;
background: #3cb0fd;
background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
text-decoration: none;
}
input::-moz-focus-inner{border:0;padding:0}
p{font-size:1em;padding:0 1em 1em 1em}
form,p{width:90%;margin:0 auto}
.fb-like{padding:0 1em 2em 1em}
@media all and (max-width: 1150px){
	h1{font-size:2em}
}
@media all and (max-width: 900px){
	article{width:90%}
}
@media all and (max-width: 675px){
	h1{padding:1em 0.75em 1em 0.75em;}
	input[type=text]{width:100%}
	input[type=submit]{width:100%;float:left}
	.intro{display:none}
}