html
	{
		height: 100%;
		margin: 0;
		padding: 0;
		width: 100%;
	}

	body 
	{
		background-color: #ddd;
		height: 80%;
		margin: 0 0 0 0;
		padding: 0;
		width: 100%;
	}

	/* меню */
	
	#nav 
	{
		margin: 0 0 5px 0;
		padding: 0 0 30px 0;
		border-bottom: 1px solid #ddd;
	}

	#nav li 
	{
		margin: 0;
		padding: 0;
		display: inline;
		list-style-type: none;
	}

	#nav a:link, #nav a:visited 
	{
		float: left;
		font-size: 12px;
		line-height: 14px;
		font-weight: bold;
		padding: 6px 5px;
		margin: 0 20px 0 0;
		text-decoration: none;
		color: #555;
	}

	#nav a:link.active, #nav a:visited.active, #nav a:hover 
	{

		background-color: #eee;
		margin-top:2px;
		color: #555;
	}


	/* контейнер */
	
	.container
	{	
		position:relative;
		margin: 20px auto;
		min-height: 100%;	
		width: 85%;
		min-width: 300px;
		max-width: 1500px;
	}

	/* тело листа */
	
	.list
	{
		background: #FFF;
		/*background: -moz-linear-gradient(100% 50%, #fff, #fff 10%, #f7f7f7);
		background: -webkit-gradient(linear, 100% 100%, 50% 10%, from(#fff), to(#f7f7f7), color-stop(.1,#fff));*/
		border: 1px solid #ccc;
		-webkit-box-shadow: 2px 2px 8px rgba(0,0,0, 0.2);
		-moz-box-shadow: 2px 2px 8px rgba(0,0,0, 0.2);
		box-shadow: 2px 2px 8px rgba(0,0,0, 0.2);
		-webkit-border-bottom-right-radius: 60px 5px;
		-moz-border-radius-bottomright: 60px 5px;
		border-bottom-right-radius: 60px 5px;
		min-height: 300px;
		padding: 30px;
		position:relative;	
	}
 
	/* нижние листы */
	
	.list:before{
		background: #FFF;
		/*background: -webkit-gradient(linear, 0% 20%, 0% 92%, from(#fff), to(#f9f9f9), color-stop(.1,#fff));
		background: -moz-linear-gradient(0 0 270deg, #fff, #fff 10%, #f9f9f9);*/
		border: 1px solid #ccc;
		-webkit-box-shadow: 2px 1px 16px rgba(0,0,0, 0.2);
		-moz-box-shadow: 2px 1px 16px rgba(0,0,0,0.2);
		box-shadow: 2px 2px 16px rgba(0,0,0,0.2);
		-webkit-border-bottom-right-radius: 60px 5px;
		-moz-border-radius-bottomright: 60px 5px;
		border-bottom-right-radius: 60px 5px;
		-webkit-transform: skew(2deg,2deg)
		translate(3px,8px);
		-moz-transform: skew(2deg,2deg)
		translate(3px,8px);
		-o-transform: skew(2deg,2deg)
		translate(3px,8px);
		bottom:0; right:0;
		content: '';
		height: 100%;
		padding: 0 0 1px 0;
		position: absolute;
		transform: skew(2deg,2deg)
		translate(3px,8px);
		width: 98%;
		z-index:-1;
	}
	 
	/* верхние листы */
	
	.list:after{
		background: #FFF;
		/*background: -webkit-gradient(linear, 0% 20%, 0% 100%, from(#f7f7f7), to(#fbfbfb), color-stop(.1,#fff));
		background: -moz-linear-gradient(0 0 360deg, #f7f7f7, #fff 10%, #fbfbfb);*/
		border: 1px solid #ccc;
		-webkit-box-shadow: 0px 0px 16px rgba(0,0,0, 0.2);
		-moz-box-shadow: 0px 0px 16px rgba(0,0,0, 0.2);
		box-shadow: 0px 0px 16px rgba(0,0,0, 0.2);
		-webkit-transform: skew(2deg,2deg)
		translate(-1px,2px);
		-moz-transform: skew(2deg,2deg)
		translate(-1px,2px);
		-o-transform: skew(2deg,2deg)
		translate(-1px,2px);
		bottom:0; right:0;
		content: '';
		height: 98%;
		padding: 0 0 1px 0;
		position: absolute;
		transform: skew(2deg,2deg)
		translate(-1px,2px);
		width: 98%;
		z-index:-1;
	}

	/* текст внутри листа */
	
	.list p
	{
		color: #555;
		margin: 5px;
		outline: none;
		text-align: justify;
	}
	
	.ouch {
		text-align: center;
		font-size: 40px;
	}
	
	/* адаптивная верстка */
	
	@media (max-width: 480px) {
		.ouch {
			font-size: 60px;
		}
		.img-size {
			width: 90%;
		}
		.icon-size {
			width: 192px;
			height: 192px;
		}
	}
	@media (min-width: 481px) and (max-width: 1200px) {
		.ouch {
			font-size: 60px;
		}
		.img-size {
			width: 90%;
		}
		.icon-size {
			width: 128px;
			height: 128px;
		}
	}
	@media (min-width: 1201px) {
		.ouch {
			font-size: 30px;
		}
		.img-size {
			width: 25%;
		}
		.icon-size {
			width: 64px;
			height: 64px;
		}
	}