@charset "utf-8";
/* CSS Document */

@media all and (min-width:640px) and (max-width:786px) {
	.social img {    margin: 0 4px}
	.social{left:0}
	footer .left {    width: 44%}
	
	
	.content .box:nth-child(1) aside {
		   background: url(../img/home-block.png) -67px -3px no-repeat;
		   background-size: 590px;
		   margin:0;
		   height: 151px}
.content .box:nth-child(2) aside {
    background: url(../img/home-block.png) -206px 12px no-repeat;
    background-size: 542px;
    height: 151px}
.content .box:nth-child(3) aside {
    background: url(../img/home-block.png) -354px 14px no-repeat;
    background-size: 610px;
    margin:0;
    height: 151px}
.content .box:nth-child(4) aside {
    background: url(../img/home-block.png) -484px 14px no-repeat;
    background-size: 610px;
    margin:0;
    height: 151px}

section.hm-blk {display: inline-block;    height: 287px}

.content .box h2 {
    font: lighter 10px/normal 'Roboto', sans-serif}
.content .box{height: 233px;width: 115px;padding: 10px 0 0 0;overflow:hidden}
.content .box button {font-size:12px;padding:5px;margin: 0px 10px}

}
@media all and (min-width:600px) and (max-width:640px) {
	
	.content .box{    width: 47%;    margin: 0 2% 15px 0px}
	.content .box h2{    font: lighter .9em/normal 'Roboto', sans-serif}
	
	}
	
	@media all and (min-width:786px) and (max-width:950px) {
	.wrop{width:100%}
	.content .box{    width: 23%;    margin: 0 2% 15px 0px}
	.content .box h2{    font: lighter .9em/normal 'Roboto', sans-serif}
	
	}