.mimeType {
    position: relative;
    display: inline-block;    
    height: 48px;        
    clear: both;
    margin-top: 10px;
    margin-bottom: 5px;    
}

.mimeType.xls:before {
    margin-top:-15px;
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 48px;    
    height: 48px;    
    background-image: url("../images/mimeTypes/xls-icon-48x48.png");
    background-repeat: no-repeat;
}

.mimeType.xlsx:before {
    margin-top:-15px;
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 48px;    
    height: 48px;    
    background-image: url("../images/mimeTypes/xlsx-icon-48x48.png");
    background-repeat: no-repeat;
}

.mimeType.docx:before {
    margin-top:-15px;
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 48px;    
    height: 48px;    
    background-image: url("../images/mimeTypes/docx-icon-48x48.png");
    background-repeat: no-repeat;
}

.mimeType.doc:before {
    margin-top:-15px;
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 48px;    
    height: 48px;    
    background-image: url("../images/mimeTypes/doc-icon-48x48.png");
    background-repeat: no-repeat;
}

.mimeType.ppt:before {
    margin-top:-15px;
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 48px;    
    height: 48px;    
    background-image: url("../images/mimeTypes/ppt-icon-48x48.png");
    background-repeat: no-repeat;
}

.mimeType.pptx:before {
    margin-top:-15px;
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 48px;    
    height: 48px;    
    background-image: url("../images/mimeTypes/pptx-icon-48x48.png");
    background-repeat: no-repeat;
}

.mimeType.pdf:before {
    margin-top:-15px;
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 48px;    
    height: 48px;    
    background-image: url("../images/mimeTypes/pdf-icon-48x48.png");
    background-repeat: no-repeat;
}

.mimeType.zip:before {
    margin-top:-15px;
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 48px;    
    height: 48px;    
    background-image: url("../images/mimeTypes/zip-icon-48x48.png");
    background-repeat: no-repeat;
}

.mimeType.txt:before {
    margin-top:-15px;
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 48px;    
    height: 48px;    
    background-image: url("../images/mimeTypes/txt-icon-48x48.png");
    background-repeat: no-repeat;
}

.mimeType.png:before, .mimeType.jpg:before, .mimeType.jpeg:before, .mimeType.bmp:before, .mimeType.gif:before {
    margin-top:-15px;
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 48px;    
    height: 48px;    
    background-image: url("../images/mimeTypes/img-icon-48x48.png");
    background-repeat: no-repeat;
}

.mimeType:before {
    margin-top:-15px;
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 48px;    
    height: 48px;    
    background-image: url("../images/mimeTypes/unknown-icon-48x48.png");
    background-repeat: no-repeat;
}

/*mimetypes xs*/ 
.mimeTypeXs {
    position: relative;    
    height: 16px;
    width: 16px;
    clear: both;        
}

.mimeTypeXs.xls:before {
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 16px;    
    height: 16px;    
    background-image: url("../images/mimeTypes/xls-icon-16x16.png");
    background-repeat: no-repeat;
}

.mimeTypeXs.xlsx:before {
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 16px;    
    height: 16px;    
    background-image: url("../images/mimeTypes/xlsx-icon-16x16.png");
    background-repeat: no-repeat;
}

.mimeTypeXs.docx:before {
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 16px;    
    height: 16px;    
    background-image: url("../images/mimeTypes/docx-icon-16x16.png");
    background-repeat: no-repeat;
}

.mimeTypeXs.doc:before {
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 16px;    
    height: 16px;    
    background-image: url("../images/mimeTypes/doc-icon-16x16.png");
    background-repeat: no-repeat;
}

.mimeTypeXs.ppt:before {
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 16px;    
    height: 16px;    
    background-image: url("../images/mimeTypes/ppt-icon-16x16.png");
    background-repeat: no-repeat;
}

.mimeTypeXs.pptx:before {
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 16px;    
    height: 16px;    
    background-image: url("../images/mimeTypes/pptx-icon-16x16.png");
    background-repeat: no-repeat;
}

.mimeTypeXs.pdf:before {
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 16px;    
    height: 16px;    
    background-image: url("../images/mimeTypes/pdf-icon-16x16.png");
    background-repeat: no-repeat;
}

.mimeTypeXs.zip:before {
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 16px;    
    height: 16px;    
    background-image: url("../images/mimeTypes/zip-icon-16x16.png");
    background-repeat: no-repeat;
}

.mimeTypeXs.txt:before {
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 16px;    
    height: 16px;    
    background-image: url("../images/mimeTypes/txt-icon-16x16.png");
    background-repeat: no-repeat;
}

.mimeTypeXs.pjTask:before {    
    left: 0;
    content: " ";
    float: left;
    width: 16px;
    height: 16px;
    background-image: url("../images/mimeTypes/pjTask-icon-16x16.png");
    background-repeat: no-repeat;
}

.mimeTypeXs.pjDocu:before {    
    left: 0;
    content: " ";
    float: left;
    width: 16px;
    height: 16px;
    background-image: url("../images/mimeTypes/pjDocu-icon-16x16.png");
    background-repeat: no-repeat;
}

.mimeTypeXs.task:before {
    left: 0;
    content: " ";
    float: left;
    width: 16px;
    height: 16px;
    background-image: url("../images/mimeTypes/pjTask-icon-16x16.png");
    background-repeat: no-repeat;
}

.mimeTypeXs.wiki:before {
    left: 0;
    content: " ";
    float: left;
    width: 16px;
    height: 16px;
    background-image: url(../images/mimeTypes/pjDocu-icon-16x16.png");
    background-repeat: no-repeat;
}

.mimeTypeXs.docu:before {
    left: 0;
    content: " ";
    float: left;
    width: 16px;
    height: 16px;
    background-image: url("../images/mimeTypes/pjDocu-icon-16x16.png");
    background-repeat: no-repeat;
}

.mimeTypeXs.png:before, .mimeTypeXs.jpg:before, .mimeTypeXs.jpeg:before, .mimeTypeXs.bmp:before, .mimeTypeXs.gif:before {
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 16px;    
    height: 16px;    
    background-image: url("../images/mimeTypes/img-icon-16x16.png");
    background-repeat: no-repeat;
}

.mimeTypeXs:before {
    margin-right: 5px;
    left: 0;
    content: " ";
    float: left;    
    width: 16px;    
    height: 16px;    
    background-image: url("../images/mimeTypes/unknown-icon-16x16.png");
    background-repeat: no-repeat;
}

.mimeTypeXsButton {
    padding-top: 3px;
}