/*.box {*/
    /*font-size: 1.25rem; !* 20 *!*/
    /*background-color: #eeeeee;*/
    /*position: relative;*/
    /*padding: 40px 20px;*/
/*}*/
.box.has-advanced-upload {
    outline: 2px dashed #d9d9d9;
    outline-offset: -10px;

    -webkit-transition: outline-offset .15s ease-in-out, background-color .15s linear;
    transition: outline-offset .15s ease-in-out, background-color .15s linear;
}
.box.is-dragover {
    outline-offset: -20px;
    outline-color: #c8dadf;
    background-color: #fff;
}
.box__dragndrop,
.box__icon {
    display: none;
}
.box.has-advanced-upload .box__dragndrop {
    display: inline;
}
.box.has-advanced-upload .box__icon {
    width: 100%;
    height: 50px;
    fill: #92b0b3;
    display: block;
    margin-bottom: 40px;
}

.box.is-uploading .box__input,
.box.is-success .box__input,
.box.is-error .box__input {
    visibility: hidden;
}
.box .box__input {
    text-align: center;
}
.box__uploading,
.box__success,
.box__error {
    display: none;
}
.box.is-uploading .box__uploading,
.box.is-success .box__success,
.box.is-error .box__error {
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    left: 0;

    -webkit-transform: translateY( -50% );
    transform: translateY( -50% );
}
.box__uploading {
    font-style: italic;
}
.box__success {
    -webkit-animation: appear-from-inside .25s ease-in-out;
    animation: appear-from-inside .25s ease-in-out;
}
@-webkit-keyframes appear-from-inside {
    from{ -webkit-transform: translateY( -50% ) scale( 0 ); }
    75%	{ -webkit-transform: translateY( -50% ) scale( 1.1 ); }
    to	{ -webkit-transform: translateY( -50% ) scale( 1 ); }
}
@keyframes appear-from-inside {
    from{ transform: translateY( -50% ) scale( 0 ); }
    75%	{ transform: translateY( -50% ) scale( 1.1 ); }
    to	{ transform: translateY( -50% ) scale( 1 ); }
}

.box__restart {
    font-weight: 700;
}
.box__restart:focus,
.box__restart:hover {
    color: #39bfd3;
}

/*.js .box__file {*/
    /*width: 0.1px;*/
    /*height: 0.1px;*/
    /*opacity: 0;*/
    /*overflow: hidden;*/
    /*position: absolute;*/
    /*z-index: -1;*/
/*}*/
/*.js .box__file + label {*/
    /*max-width: 80%;*/
    /*text-overflow: ellipsis;*/
    /*white-space: nowrap;*/
    /*cursor: pointer;*/
    /*display: inline-block;*/
    /*overflow: hidden;*/
/*}*/
/*.js .box__file + label:hover strong,*/
/*.box__file:focus + label strong,*/
/*.box__file.has-focus + label strong {*/
    /*color: #39bfd3;*/
/*}*/
/*.js .box__file:focus + label,*/
/*.js .box__file.has-focus + label {*/
    /*outline: 1px dotted #000;*/
    /*outline: -webkit-focus-ring-color auto 5px;*/
/*}*/
/*.js .box__file + label * {*/
    /*!* pointer-events: none; *! !* in case of FastClick lib use *!*/
/*}*/
.box__file {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}
.box__file + label {
    max-width: 80%;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
}
.box__file + label:hover strong,
.box__file:focus + label strong,
.box__file.has-focus + label strong {
    color: #39bfd3;
}
.box__file:focus + label,
.box__file.has-focus + label {
    outline: 1px dotted #000;
    outline: -webkit-focus-ring-color auto 5px;
}
.box__file + label * {
    /* pointer-events: none; */ /* in case of FastClick lib use */
}

/*.no-js .box__file + label {*/
    /*display: none;*/
/*}*/

/*.no-js .box__button {*/
    /*display: block;*/
/*}*/
.box__button {
    font-weight: 700;
    color: #e5edf1;
    background-color: #39bfd3;
    display: block;
    padding: 8px 16px;
    margin: 40px auto 0;
}
.box__button:hover,
.box__button:focus {
    background-color: #0f3c4b;
}

.upload-container input[type="file"] {
	width: 0.1px;
	height: 0.1px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	z-index: -1;
}

.upload-container input[type="file"] + div label{
    font-size: 16px;
    letter-spacing: 0.6px;
}
.upload-container input[type="file"] + div label svg{
    fill: white;
}
.upload-container input[type="file"] + div{
    box-sizing: border-box;
    background: transparent;
    padding: 15px;
    margin: 15px 0;
}

/* .upload-container input[type="file"] + label {
    font-size: 1.25em;
    font-weight: 700;
    color: #fff;
    background-color: #337ab7;
    border-color: #2e6da4;
    display: inline-block;
    cursor: pointer;
}

.upload-container input[type="file"]:focus + label,
.upload-container input[type="file"] + label:hover {
    background-color: #286090;
    border-color: #204d74;
} */


/****** custom dropzone.css *******/

/*
 * The MIT License
 * Copyright (c) 2012 Matias Meno <m@tias.me>
 */
@-webkit-keyframes passing-through {
    0% {
        opacity: 0;
        -webkit-transform: translateY(40px);
        -moz-transform: translateY(40px);
        -ms-transform: translateY(40px);
        -o-transform: translateY(40px);
        transform: translateY(40px); }
    30%, 70% {
        opacity: 1;
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px); }
    100% {
        opacity: 0;
        -webkit-transform: translateY(-40px);
        -moz-transform: translateY(-40px);
        -ms-transform: translateY(-40px);
        -o-transform: translateY(-40px);
        transform: translateY(-40px); } }
@-moz-keyframes passing-through {
    0% {
        opacity: 0;
        -webkit-transform: translateY(40px);
        -moz-transform: translateY(40px);
        -ms-transform: translateY(40px);
        -o-transform: translateY(40px);
        transform: translateY(40px); }
    30%, 70% {
        opacity: 1;
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px); }
    100% {
        opacity: 0;
        -webkit-transform: translateY(-40px);
        -moz-transform: translateY(-40px);
        -ms-transform: translateY(-40px);
        -o-transform: translateY(-40px);
        transform: translateY(-40px); } }
@keyframes passing-through {
    0% {
        opacity: 0;
        -webkit-transform: translateY(40px);
        -moz-transform: translateY(40px);
        -ms-transform: translateY(40px);
        -o-transform: translateY(40px);
        transform: translateY(40px); }
    30%, 70% {
        opacity: 1;
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px); }
    100% {
        opacity: 0;
        -webkit-transform: translateY(-40px);
        -moz-transform: translateY(-40px);
        -ms-transform: translateY(-40px);
        -o-transform: translateY(-40px);
        transform: translateY(-40px); } }
@-webkit-keyframes slide-in {
    0% {
        opacity: 0;
        -webkit-transform: translateY(40px);
        -moz-transform: translateY(40px);
        -ms-transform: translateY(40px);
        -o-transform: translateY(40px);
        transform: translateY(40px); }
    30% {
        opacity: 1;
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px); } }
@-moz-keyframes slide-in {
    0% {
        opacity: 0;
        -webkit-transform: translateY(40px);
        -moz-transform: translateY(40px);
        -ms-transform: translateY(40px);
        -o-transform: translateY(40px);
        transform: translateY(40px); }
    30% {
        opacity: 1;
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px); } }
@keyframes slide-in {
    0% {
        opacity: 0;
        -webkit-transform: translateY(40px);
        -moz-transform: translateY(40px);
        -ms-transform: translateY(40px);
        -o-transform: translateY(40px);
        transform: translateY(40px); }
    30% {
        opacity: 1;
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px); } }
@-webkit-keyframes pulse {
    0% {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1); }
    10% {
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        -ms-transform: scale(1.1);
        -o-transform: scale(1.1);
        transform: scale(1.1); }
    20% {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1); } }
@-moz-keyframes pulse {
    0% {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1); }
    10% {
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        -ms-transform: scale(1.1);
        -o-transform: scale(1.1);
        transform: scale(1.1); }
    20% {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1); } }
@keyframes pulse {
    0% {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1); }
    10% {
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        -ms-transform: scale(1.1);
        -o-transform: scale(1.1);
        transform: scale(1.1); }
    20% {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1); } }
.dropzone, .dropzone * {
    box-sizing: border-box; }

.dropzone {
    /*border: 2px solid #f0f0f0;*/
    background: transparent;
    /*padding: 20px 20px; }*/
    padding: 15px;
    margin: 15px 0;
    /*border-radius: 8px;*/
}
.dropzone form {
    display: inline-block;
}
.dropzone small {
    font-size: 80%;
    margin-left: 15px;
}

/*.dropzone.dz-clickable {*/
    /*cursor: pointer; }*/
/*.dropzone.dz-clickable * {*/
/*cursor: default; }*/
/*.dropzone.dz-clickable .dz-message, .dropzone.dz-clickable .dz-message * {*/
/*cursor: pointer; }*/
/*.dropzone.dz-started .dz-message {*/
/*display: none; }*/
/*.dropzone.dz-drag-hover {*/
/*border-style: solid; }*/
/*.dropzone.dz-drag-hover .dz-message {*/
/*opacity: 0.5; }*/

button[id^='add-']{
    font-size: 16px;
    letter-spacing: 0.6px;
}
button[id^='add-'] svg {
    fill: white;
}

.dropzone-preview .dz-message {
    text-align: center;
    margin: 2em 0; }
.dropzone-preview .dz-preview {
    position: relative;
    display: flex;
    margin: 0;
    justify-content: space-between;
    align-items: center;
    padding-right: 15px;
}
.dropzone-preview .dz-preview:hover {
    z-index: 1000; }
/*.dropzone-preview .dz-preview:hover .dz-details {*/
    /*opacity: 1; }*/
.dropzone-preview .dz-preview.dz-file-preview .dz-image {
    /*border-radius: 6px;*/
    background: pink;
    background: linear-gradient(to bottom, #eee, #ddd); }
/*.dropzone-preview .dz-preview.dz-file-preview .dz-details {*/
    /*opacity: 1; }*/
.dropzone-preview .dz-preview {
    background-color: #ffffff;
    margin-bottom: 10px;
    border: 1px solid #ededed;
}
.dropzone-preview .dz-preview .dz-details {
    -webkit-transition: opacity 0.2s linear;
    -moz-transition: opacity 0.2s linear;
    -ms-transition: opacity 0.2s linear;
    -o-transition: opacity 0.2s linear;
    transition: opacity 0.2s linear; }
.dropzone-preview .dz-preview .dz-remove {
    /*text-align: center;*/
    /*display: block;*/
    cursor: pointer;
    /*border: none;*/
    /*position: absolute;*/
    /*top: 15px;*/
    /*right: 15px;*/
    /*line-height: 100%;*/
    font-size: 13px;
    color: #fff;
    background-color: #337ab7;
    border-color: #2e6da4;
}
.dropzone-preview .dz-preview .dz-remove span {
    font-size: 13px;
}
/*.dropzone-preview .dz-preview .dz-remove:hover {*/
    /*text-decoration: underline; }*/
/*.dropzone-preview .dz-preview:hover .dz-details {*/
    /*opacity: 1; }*/
.dropzone-preview .dz-preview .dz-details {
    /*z-index: 20;*/
    /*position: absolute;*/
    /*top: 0;*/
    /*left: 0;*/
    /*opacity: 0;*/
    /*min-width: 100%;*/
    /*max-width: 100%;*/
    /*padding: 2em 1em;*/
    /*font-size: 13px;*/
    text-align: left;
    color: rgba(0, 0, 0, 0.9);
    line-height: 99%;
    width: 65%;
    /*width: 100%;*/
}
.dropzone-preview .dz-preview .dz-details .dz-size {
    margin: 0.1em 0 0.6em;
}
/*.dropzone-preview .dz-preview .dz-details .dz-filename {*/
    /*white-space: nowrap; }*/
/*.dropzone-preview .dz-preview .dz-details .dz-filename:hover span {*/
    /*border: 1px solid rgba(200, 200, 200, 0.8);*/
    /*background-color: rgba(255, 255, 255, 0.8); }*/
.dropzone-preview .dz-preview .dz-details .dz-filename:not(:hover) {
    overflow: hidden;
    text-overflow: ellipsis; }
/*.dropzone-preview .dz-preview .dz-details .dz-filename:not(:hover) span {*/
    /*border: 1px solid transparent; }*/
.dropzone-preview .dz-preview .dz-details .dz-filename span, .dropzone-preview .dz-preview .dz-details .dz-size span {
    /*background-color: rgba(255, 255, 255, 0.4);*/
    /*padding: 0 0.4em;*/
    /*border-radius: 3px; */
    font-size: 13px;
}
.dropzone-preview .dz-error .dz-image img {
    -webkit-transform: scale(1.05, 1.05);
    -moz-transform: scale(1.05, 1.05);
    -ms-transform: scale(1.05, 1.05);
    -o-transform: scale(1.05, 1.05);
    transform: scale(1.05, 1.05);
    -webkit-filter: blur(8px);
    filter: blur(8px);
}
.dropzone-preview .dz-preview .dz-image {
    /*border-radius: 20px;*/
    overflow: hidden;
    width: 120px;
    height: 120px;
    position: relative;
    display: block;
    z-index: 10; }
.dropzone-preview .dz-preview .dz-image img {
    display: block; }
.dropzone-preview .dz-preview .dz-image img.ext_pdf {
    display: block;
    margin: 28px auto;
    width: 55px;
}

.dropzone-preview .dz-preview.dz-success .dz-success-mark {
    -webkit-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
    -moz-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
    -ms-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
    -o-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
    animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1); }
.dropzone-preview .dz-preview.dz-error .dz-error-mark {
    opacity: 1;
    -webkit-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
    -moz-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
    -ms-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
    -o-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
    animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1); }
.dropzone-preview .dz-preview.dz-error .dz-error-mark:after {
    content: '';
    width: 120px;
    height: 120px;
    background-color: rgba(0,0,0, .3);
    display: block;
    position: absolute;
    top: -35px;
    left: -35px;
    z-index: -1;
}
.dropzone-preview .dz-preview .dz-success-mark, .dropzone-preview .dz-preview .dz-error-mark {
    pointer-events: none;
    opacity: 0;
    z-index: 500;
    position: absolute;
    display: block;
    top: 34px;
    left: 34px;
    /*top: 50%;*/
    /*left: 50%;*/
    /*margin-left: -27px;*/
    /*margin-top: -27px; */
}
.dropzone-preview .dz-preview .dz-success-mark svg, .dropzone-preview .dz-preview .dz-error-mark svg {
    display: block;
    width: 54px;
    height: 54px; }
.dropzone-preview .dz-preview.dz-processing .dz-progress {
    opacity: 1;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear; }
.dropzone-preview .dz-preview.dz-complete .dz-progress {
    opacity: 0;
    -webkit-transition: opacity 0.4s ease-in;
    -moz-transition: opacity 0.4s ease-in;
    -ms-transition: opacity 0.4s ease-in;
    -o-transition: opacity 0.4s ease-in;
    transition: opacity 0.4s ease-in;
    position: absolute;
}
.dropzone-preview .dz-preview:not(.dz-processing) .dz-progress {
    -webkit-animation: pulse 6s ease infinite;
    -moz-animation: pulse 6s ease infinite;
    -ms-animation: pulse 6s ease infinite;
    -o-animation: pulse 6s ease infinite;
    animation: pulse 6s ease infinite; }
.dropzone-preview .dz-preview .dz-progress {
    opacity: 1;
    height: 4px;
    margin-bottom: 8px;
    background: rgba(255, 255, 255, 0.9);
    -webkit-transform: scale(1);
    border-radius: 4px;
    overflow: hidden; }
.dropzone-preview .dz-preview .dz-progress .dz-upload {
    background: #dedede;
    background: linear-gradient(to bottom, #00af0d, #21b736);
    position: absolute;
    /*top: 0;*/
    height: 5px;
    left: 0;
    bottom: 0;
    width: 0;
    -webkit-transition: width 300ms ease-in-out;
    -moz-transition: width 300ms ease-in-out;
    -ms-transition: width 300ms ease-in-out;
    -o-transition: width 300ms ease-in-out;
    transition: width 300ms ease-in-out; }
.dropzone-preview .dz-preview.dz-error .dz-details .dz-filename {
    color: red;
}
.dropzone-preview .dz-preview.dz-error .dz-error-message {
    display: block; }
.dropzone-preview .dz-preview.dz-error:hover .dz-error-message {
    opacity: 1;
    pointer-events: auto; }
.dropzone-preview .dz-preview .dz-error-message {
    pointer-events: none;
    z-index: 1000;
    position: absolute;
    display: block;
    display: none;
    opacity: 0;
    -webkit-transition: opacity 0.3s ease;
    -moz-transition: opacity 0.3s ease;
    -ms-transition: opacity 0.3s ease;
    -o-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
    /*border-radius: 8px;*/
    font-size: 13px;
    top: 130px;
    left: -10px;
    width: 140px;
    background: #be2626;
    background: linear-gradient(to bottom, #be2626, #a92222);
    padding: 0.5em 1.2em;
    color: white; }
.dropzone-preview .dz-preview .dz-error-message:after {
    content: '';
    position: absolute;
    top: -6px;
    left: 64px;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #be2626; }

.dropzone-preview .dz-image-preview .dz-image img {
    max-width: 100%;
}
