1. Open the file style/engine.css and at the bottom add:
/*---Emoji---*/
.emoji {
border: none;
vertical-align: middle;
width: 22px;
height: 22px;
}
/* --- Sorting articles --- */
.sort { list-style: none; padding: 0; margin: 0; }
.sort > li, .sort { display: inline; }
.sort > li { margin: 0 0 0 3%; }
.sort > li a { color: #353535; }
.sort > li.asc a, .sort > li.desc a { color: #3394e6; }
.sort > li.asc a:after, .sort > li.desc a:after {
content: "";
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAsBAMAAACj90TiAAAAG1BMVEUAAAAzlOYzlOYzlOYzlOYzlOYzlOYzlOYzlOar6gzlAAAACHRSTlMAjesv90eHRuQt1XUAAABSSURBVBjTzdCxDQAhDENRSyzAEFdQ0zDB9axEgzw2DokEI1A9/S4OyAxADEcpPGlpFKWoSpEKp0Dlb6SvG2jY4Fka4tw4PqbEsDNTcb8gn/d4LPQHQDdjhblbAAAAAElFTkSuQmCC);
display: inline-block;
vertical-align: middle;
margin: -1px 0 0 .4em;
width: 6px; height: 11px;
-webkit-background-size: 6px auto; background-size: 6px auto;
}
.sort > li.asc a:after { background-position: 0 -11px; }
/*---Additional fields---*/
.xfieldsrow {
padding-top:5px;
clear: both;
}
.xfieldscolleft {
float: left;
width: 30%;
}
.xfieldscolright {
float: left;
width: 70%;
}
.file-box {
width: 95%;
max-width: 437px;
border:1px solid #B3B3B3;
-moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;
background-color: #F5F5F5;
padding: 10px;
margin-top: 10px;
}
.qq-uploader { position:relative; width: 100%;}
.qq-upload-button {
display:inline-block;
padding:4px 10px 4px 10px;
margin-top:5px;
font: bold 11px/1.5em Verdana;color:#000000;
border:1px solid #CACACA;
cursor:pointer;
}
.qq-upload-drop-area {
position:absolute; top:0; left:0; width:100%; height:100%; z-index:2;
max-width: 437px;
background:#FF9797; text-align:center;
}
.qq-upload-drop-area span {
display:block; position:absolute; top: 50%; width:100%; margin-top:-8px; font-size:16px;
}
.qq-upload-drop-area-active {background:#FF7171;}
.uploadedfile {
width: 115px;
height: 130px;
margin: 10px 5px 5px 5px;
border:1px solid #B3B3B3;
box-shadow: 0px 1px 4px rgba(0,0,0,0.3);
-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
text-align: center;
background:#ffffff;
}
.uploadedfile .uploadimage {
margin-top: 5px;
width: 115px;
height: 90px;
display: table-cell;
text-align: center;
vertical-align:middle;
}
.uploadedfile .info {
text-align: left;
white-space: nowrap;
margin: 0px 5px 0px 5px;
overflow: hidden;
}
.progress {
overflow:hidden;
margin-top:10px;
margin-bottom:10px;
background-color:whitesmoke;
height:10px;
-webkit-border-radius:8px;
-moz-border-radius:8px;
-ms-border-radius:8px;
-o-border-radius:8px;
border-radius:8px;
background:#eee;
-webkit-box-shadow:0 1px 0 white, 0 0px 0 1px rgba(0, 0, 0, 0.1) inset, 0 1px 4px rgba(0, 0, 0, 0.2) inset;
box-shadow:0 1px 0 white, 0 0px 0 1px rgba(0, 0, 0, 0.1) inset, 0 1px 4px rgba(0, 0, 0, 0.2) inset;
}
.progress .progress-bar {
float:left;
width:0%;
font-size:12px;
line-height:20px;
color:white;
text-align:center;
background-color:#428bca;
-webkit-box-shadow:inset 0 -1px 0 rgba(0, 0, 0, 0.15);
box-shadow:inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-webkit-transition:width 0.6s ease;
transition:width 0.6s ease;
-webkit-border-radius:8px;
-moz-border-radius:8px;
-ms-border-radius:8px;
-o-border-radius:8px;
border-radius:8px;
-webkit-box-shadow:none;
box-shadow:none;
height:8px;
}
.progress-bar span{
position:absolute;
width:1px;
height:1px;
margin:-1px;
padding:0;
overflow:hidden;
clip:rect(0 0 0 0);
border:0;
}
.progress-blue {
background-image:-webkit-gradient(linear, left 0%, left 100%, from(#9bcff5), to(#6db9f0));
background-image:-webkit-linear-gradient(top, #9bcff5, 0%, #6db9f0, 100%);
background-image:-moz-linear-gradient(top, #9bcff5 0%, #6db9f0 100%);
background-image:linear-gradient(to bottom, #9bcff5 0%, #6db9f0 100%);
background-repeat:repeat-x;
border:1px solid #55aeee;
}
Note: The list of changes is given with respect to the standard Default Template. You need to make changes to your template is already based on the needs and the layout of your template directly. Not all change is needed to your site, and optionally that the design is right for your site.
Source: dle-news.ru