* { /* star applies things to every element, sort of like the wild card, eliminating margins and padding and 
set a default font */
	margin:0;
	padding:0;
	font-family:Helvetica, sans-serif;
	-webkit-text-size-adjust:none; /* for iPhone (don't want text to change size when screen adjusted to landscape */
}
#wrapper{
	width:auto;
	max-width:1250px;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	border:2px solid #000;
}
header{
	text-align:center;
	background:#000000;
	height:80px;
}
.clear{
	clear:both;
}
header img{
	margin-top:15px;
	max-width:auto;
}
#feature {
    margin: 25px auto;
    width: 500px;
    max-width: 100%;
    background-color: #f5f5f5;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 3px 8px rgba(0,0,0,0.15);
    box-sizing: border-box;
}
#feature h1{
	color:red;
	padding-left:18px;
	margin-bottom:10px;
}
#feature .feature-img{
    float: left;
    width: 200px;
    height: 200px;
    margin-right: 25px;
    border: 1px solid #000;
}
#feature p{
    line-height: 1.5;
}
#news h3{
	background:#333;
	padding: 10px 15px;
	margin-bottom:15px;
	text-align:left;
	color:white;
}
#news .story{
	padding:20px 10px;
	border-bottom: 1px solid #000;
	transition: background-color 0.3s ease;
}
#news .story:hover{
    background-color:#f0f0f0;
}
#news .story h4{
	margin-bottom: 8px;
}
#news .story img{
	float:left;
	margin-right:10px;
	width:150px;
	height:100px;
	border:1px solid #000;
}

/*For tablet/medium screens */
@media screen and (max-width:800px){
	#wrapper{	
		width:auto;
		max-width:none;
		height:auto;
		margin-left:auto;
		margin-right:auto;
		border:2px solid #000;
	}
	#feature{
		margin:15px auto 15px 5px;
		text-align:left;
		width:auto;
	}
    #news .story{
        padding:15px;
    }
    #news .story img{
        width:115px;
        height:80px;
        margin-right:15px;
    }
    #news .story h4{
        font-size:1.1em;
        line-height:1.2;
    }
    #news h3{
        padding:12px 15px;
    }
}
/*For smallest screens */
@media screen and (max-width:400px){
	#feature {
        width:auto;
        margin:15px 10px;
        padding:15px;
    }
    #feature .feature-img{
        float:none;
        display:block;
        width:100%;
        height:auto;
        margin:0 0 15px 0;
    }
    #feature h1{
        padding-left:0;
        text-align:center;
    }
    #news .story img{
        display:none;
    }
}