* {padding:0;margin:0;}

html {width:100%;height:100%;}
body {font-family:Arial, Helvetica, Sans-serif;font-size:14px;line-height:1.5;font-weight:400;color:#fff; 
			-webkit-background-size: cover;
			-moz-background-size: cover;
			-o-background-size: cover;
			background-size: cover;
}

.container {margin:0 auto;}

header {margin:0px 0;}
header img {width:100%;}

aside {float:right;margin:0 0 25px; }
aside nav ul {list-style:none;}
aside nav ul li {margin-bottom:1px;}
aside nav ul li a {display:block;text-decoration:none;}
aside nav ul li a:hover{ 



}
#tlo{

background: url(../images/tlo.png);border-radius:15px;

}


#main {float:left;margin:0 0 25px; background: url(../images/tlo.png);border-radius:15px;padding:10px 15px 10px 15px; }
.morph {
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
          transition: all 0.5s ease;
}
 
.morph:hover {
  transform: skewX(45deg);
transform:  skewY(30deg);
 -webkit-transform: skewX(45deg);
-webkit-transform:  skewY(30deg);
 -moz-transform: skewX(45deg);
-moz-transform:  skewY(30deg);
-o- transform: skewX(45deg);
-o-transform:  skewY(30deg);
 -ms-transform: skewX(45deg);
-ms-transform:  skewY(30deg);
  
     
       
      
         
}




footer {clear:both;color:#FFF;background: url(../images/tlo.png);padding:15px 0 15px 30px;margin:0 0 25px;}


@media (min-width: 1200px) {
	.container {width:1150px;}
	aside {width:20%;}
	#main {width:75%;}
}
@media (max-width: 1200px) and (min-width: 1100px) {
	.container {width:1050px;}
	aside {width:20%;}
	#main {width:75%;}
}
@media (max-width: 1100px) and (min-width: 900px) {
	.container {width:750px;}
	aside {width:20%;}
	#main {width:75%;}
}
@media (max-width: 900px) and (min-width: 600px) {
	.container {width:450px;}
	aside,
	#main {width:100%;}
}
@media (max-width: 600px) {
	.container {width:90%;}
	aside,
	#main {width:100%;}
}