/*
  ========================================
  Social Articles
  ========================================
*/

.articles.dir-list input[type="checkbox"]                           { display: none }
.articles.dir-list input[type="checkbox"] + label                   { cursor: pointer }
.articles.dir-list input[type="checkbox"] + label span              { display: inline-block; width: 19px; height: 19px; margin: -1px 4px 0 0; vertical-align: middle; background: url(../images/check_radio_sheet.png) left top no-repeat; cursor: pointer; }
.articles.dir-list input[type="checkbox"]:checked + label span      { background: url(../images/check_radio_sheet.png) -19px top no-repeat }
.articles.dir-list input[type="radio"]                              { display: none }
.articles.dir-list input[type="radio"] + label span                 { display: inline-block; width: 19px; height: 19px; margin: -1px 4px 0 0; vertical-align: middle; background: url(../images/check_radio_sheet.png) -38px top no-repeat; cursor: pointer; }
.articles.dir-list input[type="radio"]:checked + label span         { background: url(../images/check_radio_sheet.png) -57px top no-repeat }
.articles.dir-list #articles-dir-list                               { float: left!important; width: 100%; }
.get-started                                                        { margin: 20px 0; color: #666; font-size: 11px; text-align: center; }
.get-started a                                                      { color: #666 }
.textarea-container                                                 { width: 100%!important; margin: 0 auto; }
.buttons-container                                                  { text-align: right; float: left; margin-right: 15px; margin-left: 15px; margin-top: 30px; width: calc(100% - 30px); padding: 15px; }
.buttons-container label                                            { margin-right: 10px }
.buttons-container #publish-save                                    { vertical-align: middle; margin-right: 5px; }
.edit-controls                                                      { top: 0; right: 0; position: absolute; margin-top: 2px; display: none; }
.sa-title-input                                                     { width: calc(100% - 10px)!important; }
.editor-container                                                   { float: left; width: 100%; position: relative; }
.options                                                            { float: left; width: 100%; position: relative; height: 55px; margin-bottom: 15px; }
.sa-field-content                                                   { float: left; position: relative; width: calc(50% - 30px); margin: 15px 15px 0 15px; }
.titlelabel                                                         { color: #333; margin-bottom: 15px; margin-top: 5px; font-size: 11px; padding: 0 5px 0 0; float: left; height: 20px; vertical-align: middle!important; line-height: 19px; font-weight: bold;
    text-transform: uppercase; }
.status-label                                                       { background: 0; color: #666; float: left; font-size: 11px; font-weight: bold; height: 35px; line-height: 35px; margin-bottom: 0!important; padding: 0 10px 5px 5px!important; vertical-align: middle!important; }
.error-field                                                        { box-shadow: 0 0 4px 1px rgba(253, 9, 0, 0.8)!important }
.messages-container                                                 { float: left; text-align: center; width: 100%; background: #ffffff; border-radius: 4px; padding: 10px; display: block; /*max-width: 680px;; min-width: 630px; */ }
.messages-container label                                           { margin-bottom: 15px }
#save-waiting                                                       { width: 100%; height: 55px; position: absolute; bottom: 0; left: 0; z-index: 15; margin-bottom: 0; }
#error-box                                                          { width: 285px; height: 17px; position: absolute; bottom: 0; left: 0; z-index: 16; margin-bottom: -6px; background: rgba(255, 48, 40, 0.8); }
#error-box label                                                    { background: transparent }
#post-maker-container                                               { position: relative; float: left; padding-bottom: 40px; width: 100%; }
.article-container                                                  { float: left; position: relative; display: inline-block; width: 48%; margin: 1%; }
.article-content                                                    { width: 100%; min-height: 130px; float: left; background: white; margin-left: 0; position: relative; padding: 20px 20px 50px; margin-bottom: 15px; }
.article-image                                                      { max-width: 80px; height: 80px!important; float: left; margin-top: 10px; position: relative; width: 30%!important; background-size: cover!important; background: #e5e5e5; position: relative; }
.article-categories                                                 { width: 50%; height: 30px; float: left; margin-bottom: 2px; line-height: 30px; }
.article-data                                                       { float: left; width: 70%; margin-top: 5px; margin-left: 2%; position: relative; margin-bottom: 5px; padding-left: 10px; }
.article-data h3                                                    { font-size: 20px!important; margin-top: 5px!important; margin-bottom: 0.1em!important; }
.article-data h3 a                                                  { color: #454545; font-size: 16px; }
.more-articles-button-container                                     { margin: 20px auto 0; text-align: center; float: left; width: 100%; }
#more-articles-loader                                               { display: none }
.myself .publish,
.reference-status .publish                                          { background: #279B27 }
.myself .pending,
.reference-status .pending                                          { background: #F9FF62 }
.myself .draft,
.reference-status .draft                                            { background: #FC6464 }
.article-status                                                     { float: right!important; border-radius: 2px; height: 25px; line-height: 25px; margin-top: 5px; padding: 0 10px; width: auto; text-transform: uppercase; font-size: 12px; }
.sa-post-status-container                                           { padding: 0 5px!important; width: calc(100% - 30px)!important; border: 1px solid #e5e5e5; background: #f7f7f7; margin-bottom: 10px; }
.sa-post-status-container .publish                                  { background: #009276; color: white; }
.sa-post-status-container .pending                                  { background: #cdd264; color: #fff; }
.sa-post-status-container .draft                                    { background: #FC6464; color: #fff; }
.sa-post-status-container .new-post                                 { background: #6AD5DA; color: #fff; }
.article-metadata                                                   { position: absolute; right: 10px; top: -10px; background: #fff; padding-top: 5px; }
.author-options                                                     { }
.author-options .edit,
.author-options .delete                                             { display: block; width: 20px; height: 22px; margin: 0 10px; background-image: url(../images/editIcons.png); background-repeat: no-repeat!important; float: left; background-color: #FFF!important; opacity: 0.4; }
.deleting                                                           { background: none!important }
.delete.deleting:before                                             { content: ''!important; background: url("../images/loading.svg") no-repeat!important; width: 22px; height: 22px; display: block; background-size: contain!important; float: right; transition: none!important; background-position: 0 1px!important; }
.social-loader                                                      { background: url("../images/loading.svg") no-repeat; width: 30px!important; height: 14px!important; float: right; margin-top: 8px!important; display: none; }
.social-delete                                                      { float: right; margin-right: 20px!important; }
.author-options .edit:hover, .author-options .delete:hover { background: url(../images/editIcons.png) no-repeat }
.author-options .delete                                             { background-position: 3px 2px }
.author-options .edit                                               { background-position: -17px 2px }
.author-options .delete:hover                                       { background-position: 3px -20px }
.author-options .edit:hover                                         { background-position: -17px -20px }
.article-container .date,
.article-likes,
.article-comments                                                   { float: left; color: #A0A5A9; }
.article-likes,
.article-comments                                                   { float: right!important; width: 40%; }
.article-likes a,
.article-comments a                                                 { float: right; }
.article-likes a:focus,
.article-comments a:focus,
.article-likes a:hover,
.article-comments a:hover                                           { text-decoration: none; }
.article-container .date                                            { display: block; width: 100%; font-size: 11px; font-style: italic; }
.article-likes .likes-text,
.article-likes .likes-count                                         { margin: 0 0 0 7px; display: inline-block; float: right; }
.article-likes .likes-text                                          { line-height: 28px }
.article-likes .likes-count                                         { position: relative; top: 3px; }
.article-footer                                                     { font-weight: bold; color: #999; overflow: hidden; font-size: 11px; position: absolute; bottom: 0; left: 0; right: 0; padding: 5px; border-top: 1px dashed #e4e4e4; margin: 0 20px; }
.article-footer a                                                   { color: #999; }
#articles-container                                                 { padding-bottom: 35px; float: left; width: 100%; }
.publish-container,
.articles-container                                                 { display: block; width: 100%; }
.pending-container,
.draft-container                                                    { display: none; width: 100%; }
#save-message                                                       { display: block }
.sa-field-front .wp-editor-container                                { border: 1px solid rgba(0, 0, 0, 0.04)!important }
#sa_content_ifr                                                     { width: calc(100% - 1px)!important; }
.mce-toolbar .mce-btn button,
.qt-dfw                                                             { padding: 4px 10px!important; border: none!important; }

@media (max-width: 480px) { 
    .sa-field-content                                               { width: 100%!important; margin: 15px 0!important; }
    .bp-wrapper div.item-list-tabs#subnav ul li                     { width: 47%; border-radius: 4px; border: 1px solid #FFF; background: #e5e5e5; padding: 1%; margin-bottom: 10px; margin-right: 0; }
    .buttons-container #publish-save                                { float: left }
    .buttons-container                                              { width: 100%!important }
}

/*NEW*/
.delete-logo                                                        { position: absolute!important; right: 10px; top: 10px; }
.qq-upload-drop-area                                                { background: #f1f1f1; height: 100%; width: 100%; float: left; position: absolute; top: 0; z-index: 3; padding-top: 132px; color: #969696; }
.qq-upload-list                                                     { list-style: none; padding: 0; margin: 20px 0; }
.qq-upload-list li                                                  { width: 98%; margin-right: 1%; margin-left: 1%; padding: 8px; float: left; background: #F5F5F5; margin-bottom: 10px; position: relative; }
.qq-progress-bar                                                    { float: left; height: 3px; background: #4bc4d4!important; }
.qq-upload-cancel,
.qq-upload-size                                                     { position: absolute; top: 12px; right: 5px; }
.qq-upload-size                                                     { right: 70px }
.qq-upload-file                                                     { margin-right: 15px; float: left; width: 100%; text-align: left; }
.qq-upload-failed-text                                              { display: none }
.sa-upload-image-container                                          { position: relative; width: 100%; float: left; background: #fff; padding: 20px; }
.sa-image-container                                                 { text-align: center }
.logo-image-error-container                                         { position: absolute; bottom: 5px; left: 5px; background: #ffc5c5; padding: 0 5px; }
.qq-upload-max-size                                                 { font-size: 13px; padding-top: 10px; }
.logo-image-attaching                                               { text-align: center; position: absolute; top: 0; margin-top: 100px; z-index: 10; padding-bottom: 40px; right: 0; left: 0; background: #fff; margin-left: 50px; margin-right: 50px; }
body.is-user-profile #item-header-avatar                            { background: #FFF }

.qq-uploader                                                        { border: 4px dashed #ddd; padding: 50px 0; }
.buttons-container                                                  { background-color: #fff; }
#sa_featured_image-image-button                                     { margin-top: 0!important; }

.publish-container,
.articles-container                                                 { position: static!important }
.more-articles-button-container                                     { position: absolute; bottom: 0; }
#articles-container                                                 { position: relative; }

@media (max-width: 1670px) {
	.article-container { width: 100%; margin: 0 0 1% 0; }
}

/*
  ========================================
  Select 2
  ========================================
*/

body .select2-container                                                                    { font-size: 12px; }
body .select2-search--dropdown                                                             { padding: 0; overflow: hidden; }
body .select2-container--default .select2-search--inline .select2-search__field            { margin: 0 0 0 5px!important; }
body .select2-container--default .select2-selection--multiple .select2-selection__choice   { font-size: 10px; color: #b3b3b3; background: #f3f3f3; border: 0; padding: 5px 11px; height: 28px; }
body .select2-container--default .select2-selection--multiple .select2-selection__rendered { padding-top: 0!important; padding-bottom: 0!important; }
body .select2-container--default .select2-selection--single .select2-selection__arrow      { display: none; }
body .select2-container--default .select2-selection--multiple .select2-selection__choice__remove,
body .select2-container--default .select2-selection--single .select2-selection__clear      { font-family: sans-serif; }
body .select2-container--default .select2-selection--multiple,
body .select2-container--default.select2-container--focus .select2-selection--multiple,
body .select2-container--default .select2-selection--single                                { border: 0; height: 40px!important; font-size: 12px; }
body .select2-container--default .select2-selection--single .select2-selection__rendered   { line-height: 2!important; padding: 7px 46px 5px 15px!important; height: 40px!important; }
body .select2-container--default .select2-search--dropdown .select2-search__field,
body .select2-dropdown                                                                     { border-color: #eee!important; margin: 0; border-radius: 0; }