@import " _normalize.css ";
@import " _defaults.css ";
@import "fonts/dosis/font.css ";
a{color:currentColor;text-decoration:none}
.sm{width:100%;height:2.5rem;color:#444;color:rgba( 0,0,0,.75 );background-color:#fff;background-color:rgba( 255,255,255,.5 );overflow:hidden;position:fixed;z-index:1001;bottom:0;left:0;padding:.625rem 1.25rem 0}
.sm--dark{color:#ddd;color:rgba( 255,255,255,.75 );background-color:#111;background-color:rgba( 0,0,0,.5 )}
.sm ul{}
.sm li{float:right;margin-left:1rem}
.sm li:first-child{float:left;margin-left:0}
.sm .googleplus-one{max-width:60px}
.sm .twitter-follow>*:not( :first-child ),.sm .twitter-share>*:not( :first-child ){display:none}
@media screen{@media(min-width:0px){
    .sm li:last-child{opacity:0;transition:opacity .25s ease-in-out}
    .sm:hover li:last-child{opacity:1}
}
}
.sm__back{font-size:.875rem;font-weight:700;color:currentColor;text-transform:uppercase;position:relative}
.sm__back::before{width:0;height:0;border:.313rem solid transparent;border-left:none;border-right-color:currentColor;content:'';display:inline-block;position:relative;left:0;margin-right:.313rem;transition:left .25s ease-in-out}
.sm__back:hover::before,.sm__back:focus::before{left:-.313rem}
@media screen and (max-width:40em),screen and (max-height:40em){
    .ad,.sm{display:none}
}
body {
    font-family:Dosis,Helvetica,Arial,sans-serif;
    font-weight:400;
    min-height:100vh;
    background-color: #f4f4f0;
    padding: 10px 0 0 0;
    line-height: 1.5em;
    border-top: 2px solid #69a83a;
    margin: 1px 0 0 0;
    padding: 3rem 1.25rem; /* 80 20 */
    counter-reset: section;
}
@media screen{@media(max-width:600px){
    body{ padding-top:3rem; }
}
hr {
    margin:15px 0;
    border-bottom:1px dashed #888;
}
.header{
    margin-bottom:2rem;
}
.header img {
    max-width:100%
}

.container {
    width: 100%;
    max-width: 800px; /* 800 */
    text-align: center;
    margin: 0 auto;
}

.container h1 {
    font-size: 2em;
    font-weight: 300;
    color: #0f3c4b;
    margin-bottom: 40px;
}
.container h1 a:hover,
.container h1 a:focus {
    color: #f5c000;
}
.container .inner {
    padding:30px;
    background-color: #fff;
}
#uploader {
    outline: 2px dashed #92b0b3;
    outline-offset: -10px;
    transition: outline .25s ease-in-out, outline-offset .25s ease-in-out, background-color .25s linear;
    margin:0 auto 15px auto;
}
/*
#uploader.status-uploadinprogress {
    outline:none;
    background-image: linear-gradient(90deg, #92b0b3 50%, transparent 50%), linear-gradient(90deg, #92b0b3 50%, transparent 50%), linear-gradient(0deg, #92b0b3 50%, transparent 50%), linear-gradient(0deg, #92b0b3 50%, transparent 50%);
    background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
    background-size: 15px 3px, 15px 3px, 3px 15px, 3px 15px;
    background-position: left top, right bottom, left bottom, right top;
    animation: antwalk 2s linear infinite;
    padding: 5px;
    animation-play-state: running;
}
@keyframes antwalk {
    0% { background-position: left top, right bottom, left bottom, right   top; }
    100% { background-position: left 15px top, right 15px bottom , left bottom 15px , right   top 15px; }
}
*/
#uploader.status-uploadsuccess{
    outline-color:#69a83a; /* green */
}
#uploader.status-uploaderror{
    outline-color:#900;
}
#uploader .icon {
    width: 100%;
    height: 80px;
    color:#555;;
    fill: #92b0b3;
    display: block;
    margin: 40px 0;
    transition:2s ease;
    transform: scale(1);
}
 #uploader.status-init:hover .icon
,#uploader.status-uploadsuccess:hover .icon
,#uploader.status-uploaderror:hover .icon
{
    animation: pulse 2s infinite;
}
@keyframes pulse {
    0% { transform: scale(1.00); }
    70% {
        transform: scale(1.20);
        color:#ffec00; /* #f5c000 */
    }
    100% { transform: scale(1.00); }
}

#uploader #file { display: none; }
#uploader .file-select {
    cursor:pointer;
    font-weight:600;
    border-bottom: 1px dashed #aaa;
}
#uploader #reset
,#uploader #submit
{
    display:inline-block;
    margin:0 15px 30px 15px;
    padding: 10px 20px;
    color: #fff;
    border: 1px solid #dfdfdf;
    background: #69a83a;
    transform: scale(1);
    transition:all .2s;
}
#uploader #reset {
    background: #a74a39;
}
#uploader.status-fileselected #submit
,#uploader.status-fileselected #reset
{
    pointer-events:all;
    cursor:pointer;
    filter:none;
    opacity:1;
}
 #uploader #submit
,#uploader.status-uploadcomplete #submit
,#uploader.status-uploaderror #submit
,#uploader.status-uploadinprogress #submit
,#uploader #reset
,#uploader.status-uploadcomplete #reset
,#uploader.status-uploaderror #reset
,#uploader.status-uploadinprogress #reset
{
    pointer-events:none;
    cursor:not-allowed;
    filter:grayscale(1);
    opacity:.2;
}

#uploader.status-fileselected #reset:hover
,#uploader.status-fileselected #submit:hover
{
    transform: scale(1.05);
}
#uploader.status-uploadsuccess #reset
,#uploader.status-uploaderror #reset
{
    pointer-events:all;
    cursor:pointer;
    filter:none;
    opacity:1;
}
#uploader.status-uploadsuccess #reset {
    background-color:#69a83a;
}
#uploader #select {
    display:block;
    margin:0 auto 30px auto;
}
#uploader.status-uploadinprogress #select {
    pointer-events:none;
    cursor:not-allowed;
    filter:grayscale(1);
    opacity:.2;
}
#uploader #preview {
    opacity:0;
}
#uploader.status-fileselected #preview {
    opacity:1;
}
#uploader #preview #fileimage {
    display:block;
    margin: 0 auto;
    text-align:center;
    max-width:50%;
    max-height:10em;
    opacity:0;
    transition: width .2s;
}
#uploader.status-haspreview #preview #fileimage {
    opacity:1;
    margin-bottom:15px;
}
#uploader #preview #filedata {
    display:inline-block;
    max-width:75%;
    margin: 0 auto;
    padding:.25em 1em;;
    text-align:center;
    border: 1px dashed #888;
    opacity:0;
}
#uploader.status-fileselected #preview #filedata {
    opacity:1;
    margin-bottom:30px;
}
#uploader #preview #filedata div {
    display:inline-block;
    padding-right:1em;
}

#uploader #progress
,#uploader #progress #bar
,#uploader #progress #percent {
    height: 30px;
}
#uploader #progress {
    opacity:.25;
    transition: width .2s;
}
#uploader.status-fileselected #progress {
    opacity:1;
    margin-bottom:15px;
}
#uploader #progress {
    position: relative;
    background: #fff;
    --percent:0%;
    /* height:2em; */
    border:1px solid #aaa;
    background:#eee;
}
#uploader #progress #bar {
    background: #ccc;
    width: var(--percent);
    transition: width .2s;
}
#uploader #progress #percent {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
#uploader.status-uploadcomplete #progress #bar {
    background-color:#69a83a;
}
#uploader.status-uploaderror #progress {
    color:#fff;
}
#uploader.status-uploaderror #progress #bar {
    background-color:#900;
}





				 .box.is-dragover
                ,#uploader:hover
                {
                    outline-offset: -8px;
                    transition: outline .25s ease-in-out, outline-offset .25s ease-in-out, background-color .25s linear;
                }
				.box.is-dragover{
					background-color: #fffffa;
                }
                .box.is-dragover .file-dragdrop {
                    transition:all .25s ease;
                    color:#f5c000;
                }
					.box__dragndrop,
					.box__icon {
						display: none;
					}
					#uploader .box__dragndrop {
						display: inline;
					}
					.box__uploading,
					.box__success,
					.box__error
					{
						display: none;
                        padding-top:54px;
					}
					.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;
						transform: translateY( -50% );
					}
					.box__uploading {
						/* font-style: italic; */
					}
					.box__success {
						animation: appear-from-inside .25s ease-in-out;
					}