.dd-articleNote {
    display: block;
    margin: 0;
}

.dd-articleNote .dd-articleNote-content {
    display: block;

    padding: 10px;
    background-color: #FFF;
    border: 1px solid #d8d8d8;
}


.dd-articleNote .dd-articleNote-icon {
    display: block;
    float: left;

    width: 25px;
    height: 25px;

    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
}

.dd-articleNote.dd-articleNote--type-note .dd-articleNote-icon { background-image: url(images/note.png); }
.dd-articleNote.dd-articleNote--type-info .dd-articleNote-icon { background-image: url(images/info.png); }
.dd-articleNote.dd-articleNote--type-tip .dd-articleNote-icon { background-image: url(images/tip.png); }
.dd-articleNote.dd-articleNote--type-error .dd-articleNote-icon { background-image: url(images/error.png); }
.dd-articleNote.dd-articleNote--type-warning .dd-articleNote-icon { background-image: url(images/warning.png); }
.dd-articleNote.dd-articleNote--type-important .dd-articleNote-icon { background-image: url(images/important.png); }

.dd-articleNote .dd-articleNote-innerContent {
    margin-left: 40px;
}


.dd-articleNote .dd-articleNote-title {
    margin: 0;
    margin-bottom: 5px;

    font-family: inherit;
    font-weight: 500;
    font-size: inherit;

    color: #000;
}

.dd-articleNote .dd-articleNote-text {
    font-size: 85%;
}

/* Position: Default. */
.dd-articleNote.dd-articleNote--position-default {
    margin: 20px 0;
}

.dd-articleNote.dd-articleNote--position-default.dd-articleNote--size-small { max-width: 300px; }
.dd-articleNote.dd-articleNote--position-default.dd-articleNote--size-medium { max-width: 400px;  }
.dd-articleNote.dd-articleNote--position-default.dd-articleNote--size-large { max-width: 700px; }
.dd-articleNote.dd-articleNote--position-default.dd-articleNote--size-full { width: 100%; }


/* Position: Center. */
.dd-articleNote.dd-articleNote--position-center {
    display: block;
    margin: 20px auto;
}

.dd-articleNote.dd-articleNote--position-center.dd-articleNote--size-small { max-width: 300px; }
.dd-articleNote.dd-articleNote--position-center.dd-articleNote--size-medium { max-width: 400px;  }
.dd-articleNote.dd-articleNote--position-center.dd-articleNote--size-large { max-width: 700px; }
.dd-articleNote.dd-articleNote--position-center.dd-articleNote--size-full { width: 100%; }


/* Position: Right. */
.dd-articleNote.dd-articleNote--position-right {
    float: right;

    margin-left: 20px;
    margin-bottom: 20px;
}

.dd-articleNote.dd-articleNote--position-right .dd-articleNote-image {
   
}

.dd-articleNote.dd-articleNote--position-right.dd-articleNote--size-small { max-width: 200px; }
.dd-articleNote.dd-articleNote--position-right.dd-articleNote--size-medium { max-width: 300px;  }
.dd-articleNote.dd-articleNote--position-right.dd-articleNote--size-large { max-width: 500px; }
.dd-articleNote.dd-articleNote--position-right.dd-articleNote--size-full { max-width: 100%; }