/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
		h1, h2, h3, h4, h5, h6, p, blockquote, pre,
		a, abbr, acronym, address, big, cite, code,
		del, dfn, em, img, ins, kbd, q, s, samp,
		small, strike, strong, sub, sup, tt, var,
		b, u, i, center,
		dl, dt, dd, ol, ul, li,
		fieldset, form, label, legend,
		table, caption, tbody, tfoot, thead, tr, th, td,
		article, aside, canvas, details, embed, 
		figure, figcaption, footer, header, hgroup, 
		menu, nav, output, ruby, section, summary,
		time, mark, audio, video {
			margin: 0;
			padding: 0;
			border: 0;
			font-size: 100%;
			font: inherit;
			vertical-align: baseline;
		}
		/* HTML5 display-role reset for older browsers */
		article, aside, details, figcaption, figure, 
		footer, header, hgroup, menu, nav, section {
			display: block;
		}
		body {
			line-height: 1;
		}
		ol, ul {
			list-style: none;
		}
		blockquote, q {
			quotes: none;
		}
		blockquote:before, blockquote:after,
		q:before, q:after {
			content: '';
			content: none;
		}
		table {
			border-collapse: collapse;
			border-spacing: 0;
		}

body{
	background-color: #ccc;

}

header{
	height: 100px;
}

.area {
	width: 960px;
	height: 400px;
	display: block;
	margin: 0 auto;
	
	box-sizing:border-box;
}

.square {
	height: 300px;
	width:	300px;
	background-color: blue;
	border-radius: 5px;
	-webkit-box-shadow: 0px 1px 3px 1px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 1px 3px 1px rgba(0,0,0,0.5);
	box-shadow: 0px 1px 3px 1px rgba(0,0,0,0.5);
	-webkit-box-shadow: inset 1px 1px 4px 0px rgba(0,0,0,0.33);
	-moz-box-shadow: inset 1px 1px 4px 0px rgba(0,0,0,0.33);
	box-shadow: inset 1px 1px 4px 0px rgba(0,0,0,0.33);
}


.circle {
	width: 50px;
	height: 50px;
	background: #eee;
	-moz-border-radius: 50px;
	-webkit-border-radius: 50px;
	border-radius: 50px;
	display: inline-block;
	box-sizing-border-box;
	margin: 15px 36px 15px 36px; 
	margin: 23px 49px 17px 49px;
}

.relative{
	position: relative;
	display: block;
	bottom: 163px;
    width: 50px;
    margin: 0 auto;

}

.right {
	float: right;
}

.left {
	float: left;
}
.right1 {
	float: right;
	box-sizing-border-box;
	margin-right: 50px;
	display: block;
}

.left1 {
	float: left;
	margin-right: 50px;
	box-sizing-border-box;
	display: block;
}

.hidden {
	background-color: blue;
}

a {
	color: black;
	text-decoration: none;
	border: 1px solid #444;
	background-color: #eee;
	border-radius: 5px;
	padding: 5px 5px;
	width: 250px;
	display: block;
	margin: 0 auto;
	text-align: center;
	text-transform: uppercase;
	font-weight: 500px;
}