[html]<link href="//dl.dropbox.com/s/50g6fbds3rh4m0j/saturnicons.css" rel="stylesheet"><link href="https://fonts.googleapis.com/css?family=PT+Sans:400,700|Playfair+Display:400,900|Raleway:100" rel="stylesheet"> <style>
#geom {
width: 400px;
height: 600px;
position:relative;
margin: auto;
}
.geom1 {
width: 0;
height: 0;
border-style: solid;
border-width: 0 200px 300px 200px;
border-color: transparent transparent #525758 transparent;
}
.geom1:after {
content: '';
width: 0;
height: 0;
position: absolute;
bottom: 0px;
margin: auto;
left: 0px;
border-style: solid;
border-width: 300px 200px 0 200px;
border-color: #525758 transparent transparent transparent;
}
.geom2 {
width: 0;
height: 0;
position: absolute;
top: -300px;
left: 5px;
top: 10px;
margin: auto;
border-style: solid;
border-width: 0 195px 290px 195px;
border-color: transparent transparent #768c97 transparent;
}
.geom3 {
width: 0;
height: 0;
position: absolute;
bottom: 10px;
margin: auto;
left: 5px;
border-style: solid;
border-width: 290px 195px 0 195px;
border-color: #768c97 transparent transparent transparent;
}
.geom4 {
position: absolute;
top: 100px;
width: 0;
height: 0;
overflow: hidden;
border-style: solid;
border-width: 0 200px 350px 200px;
border-color: transparent transparent #333335 transparent;
}
.geom5 {
width: 100px;
height: 100px;
position: absolute;
top: 90px;
left: 0;
right: 0;
margin: auto;
transform: rotate(45deg);
background: #fff;
padding: 3px;
border: 1px solid #333335;
outline: 1px solid #333335;
z-index: 3;
}
.geom7 {
position: absolute;
top: -17px;
left: -17px;
right: 0px;
margin: auto;
z-index: 3;
transform:rotate(-45deg);
clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
-webkit-clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
width: 140px;
height: 140px;
background-image: url(http://forumupload.ru/uploads/0013/27/a2/2/349955.jpg);
background-size: cover;
background-position: top center;
}
.geom6 {
background: rgba(0,0,0,0.2);
width: 100px;
height: 100px;
position: absolute;
top: 95px;
left: 0;
border: 1px solid #333335;
right: 0;
opacity: 0.8;
margin: auto;
transform: scale(1,1) rotate(45deg);
animation: diamp 3s linear infinite;
}
@keyframes diamp {
0% {
transform: scale(1,1) rotate(45deg);
}
50% {
transform: scale(1.5,1.5) rotate(45deg);
opacity: 0.0;
}
100% {
transform: scale(1,1) rotate(45deg);
opacity: 0.0;
}
}
.geom8 {
transform: rotate(-45deg);
border: 1px solid #333335;
position: absolute;
bottom: 45px;
left: 0;
width: 140px;
height: 140px;
right: 0;
margin: auto;
padding: 20px;
}
.geom9 {
position: absolute;
bottom: 150px;
left: 0;
right: 0;
z-index: 10;
margin: auto;
overflow: hidden;
border-bottom: 1px solid #333335;
width: 350px;
height: 50px;
}
.geom9 h1 {
margin: 0;
text-align: center;
font-family: inter;
color: #fff;
text-transform: uppercase;
font-weight: 200;
font-size: 28px!important;
letter-spacing: 4px;
color: #fff;
}
.geom10 {
color: #fff;
height: 175px;
overflow: auto;
text-align: center;
line-height: 120%;
font: 11px pt sans;
width: 220px;
position: absolute;
margin: auto;
left: 0;
right: 0;
z-index: 10;
bottom: 205px;
}
.geom10 p:first-letter {
font: 50px playfair display;
float: left;
margin: 5px 10px 0 5px;
text-transform: uppercase;
}
.geom10 b {
font: 14px raleway;
font-weight: 100;
}
.geom10 i {
letter-spacing: 1px;
font: 12px playfair display;
font-style: italic;
font-weight: 400;
}
.geom11 {
position: absolute;
bottom: 80px;
left: 0;
right: 0;
margin: auto;
width: 100px;
text-align: center;
width: 1px;
height: 70px;
background: #333335;
}
.geom11 sub {
display: block;
text-align: center;
font: 40px raleway;
color: #333335;
margin: 60px 0 0 -20px;
}
</style><div id="geom"><div class="geom1"></div><div class="geom2"></div><div class="geom3"></div><div class="geom4"></div><div class="geom5">
<div class="geom7" style="background-image: url(http://forumupload.ru/uploads/0013/27/a2/2/349955.jpg);"></div>
</div><div class="geom6"></div><div class="geom8"></div><div class="geom9"><h1>
хазе ньето
</h1></div><div class="geom10">
Самовлюбленный мудак. <br>
<br> 02.01.87, 19 y.o.
<br> жнец в быках и разыгрывающий в баскетболе.
<br> мамин симпотяга, а папу убил)0))
<br> телепорт и аглиокинез. причинит тебе боль и переместит в другой штат.
<br> при себе имеет только пиздатое тело. все, что ему надо хранится в определенном месте, в которое Хазе может попасть в любой момент.
</div><div class="geom11"><sub><i class="sf sf-heart-2"></i></sub></div></div>[/html]