You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
112 lines
1.9 KiB
112 lines
1.9 KiB
.hex-particle-container {
|
|
width: 600px;
|
|
height: 600px;
|
|
display: block;
|
|
position: fixed;
|
|
margin-left: -300px;
|
|
margin-top: -300px;
|
|
top: 50%;
|
|
left: 50%;
|
|
}
|
|
|
|
.hex-p {
|
|
display: none;
|
|
-webkit-transform: translate(200, 200);
|
|
transform: translate(200, 200);
|
|
}
|
|
|
|
.hex-particle-blue {
|
|
fill: #2196bd;
|
|
}
|
|
.hex-particle-lightblue {
|
|
fill: #4bbfbf;
|
|
}
|
|
.hex-particle-purple {
|
|
fill: #9776b5;
|
|
}
|
|
.hex-particle-violet {
|
|
fill: #d25e9f;
|
|
}
|
|
.hex-particle-green {
|
|
fill: #4daf65;
|
|
}
|
|
.hex-particle-red {
|
|
fill: #d63d3d;
|
|
}
|
|
.hex-particle-orange {
|
|
fill: #f26b3f;
|
|
}
|
|
|
|
.overlay {
|
|
-webkit-perspective: 600px;
|
|
perspective: 600px;
|
|
position: fixed;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: none;
|
|
-webkit-transform: translateZ(0);
|
|
transform: translateZ(0);
|
|
}
|
|
|
|
.award-container {
|
|
display: none;
|
|
width: 650px;
|
|
height: 80px;
|
|
position: fixed;
|
|
left: 50%;
|
|
top: 50%;
|
|
margin-left: -325px;
|
|
font-family: 'Open Sans';
|
|
}
|
|
.award-container img {
|
|
position: absolute;
|
|
top: -25px;
|
|
left: -20px;
|
|
width: 130px;
|
|
height: 130px;
|
|
}
|
|
.award-container .content {
|
|
overflow: hidden;
|
|
position: relative;
|
|
background: #3e3e3c;
|
|
border-radius: 10px;
|
|
box-sizing: border-box;
|
|
padding: 30px;
|
|
height: 63px;
|
|
white-space: no-wrap;
|
|
margin-top: 8px;
|
|
color: #FFF;
|
|
}
|
|
.award-container .unlocked {
|
|
text-transform: uppercase;
|
|
font-size: 11px;
|
|
font-weight: 300;
|
|
text-align: center;
|
|
position: absolute;
|
|
top: 5px;
|
|
padding-left: 10px;
|
|
width: 600px;
|
|
}
|
|
.award-container .achievement {
|
|
font-size: 30px;
|
|
font-weight: 300;
|
|
text-align: center;
|
|
position: absolute;
|
|
font-family: 'Lobster';
|
|
top: 18px;
|
|
padding-left: 10px;
|
|
width: 600px;
|
|
}
|
|
.award-container .achievement:before {
|
|
content: open-quote;
|
|
}
|
|
.award-container .achievement:after {
|
|
content: close-quote;
|
|
}
|
|
.award-container .close {
|
|
position: absolute;
|
|
top: 5px;
|
|
right: 5px;
|
|
cursor: pointer;
|
|
color: #666;
|
|
}
|
|
|