/* Reset
------------------------------------------------------------ */
* { margin: 0; padding: 0; }
html { overflow-y: scroll;}
body { background:#ffffff; font-size: 13px; color: #333333;font-family: proxima-nova, sans-serif;}
ol, ul { list-style: none; margin: 0;}
ul li { margin: 0; padding: 0;}
h1 { margin-bottom: 50px; color: #111111;}	
a, img { outline: none; border:none; color: #333333; text-decoration: none;}
p { margin: 0 0 10px; margin-bottom: 30px;}
img { display: block; margin-bottom: 10px;}
text { line-height: 1.4; font-size: 13pt; text-align: center;}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { 
    display: block;
	}
	
/* Structure */
#wrapper {
	width: 96%;	
	max-width: 500px;
	margin: auto;
	} 

	#main {
	width: 47%;
	float: left;
	margin: 2%;
		}		
		

		


/* Banner */			
@media (max-width: 450px) {
#banner {
		top: 50%; /* IMPORTANT */
        left: 50%; /* IMPORTANT */
	    display: block;
        position: absolute;
 		background: url(images/main.svg) no-repeat center center;
        width: 450px;
        height: 144px;
        margin-top: -72px; /* HALF OF THE HEIGHT */
        margin-left: -225px; /* HALF OF THE WIDTH */
		max-width: 450px;
	}
	}


.glass:after{
	content: '';
	position: absolute;
	top: 2px;
	left: 2px;
	width: calc(100% - 4px);
	height: 55%;
	background: linear-gradient(rgba(255,255,255,0.8), rgba(255,255,255,0.2));
}


/* Media Queries */
@media screen and (max-width: 250px) {

	
	header nav, #main, aside {
		float: left;
		clear: left;
		width: 96%;
		}	
				
}