html,body {
  height: 100%;
}
body {

    background-color:#f2f2f2; height:100vh;
	font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size:14px;
}

h2, h3, h4 {
	color: #333544;
}

.white-color {
	color: #f8f8f8 !important;
}

input[type=image],img {
	vertical-align:middle
}

.jumbosonic a {
	color:#23272A;
	text-decoration:none;
	transition:color .15s
}

.jumbosonic a:hover,a:focus,a:active {
	color:#333544;
}

.notifications {
	clear: both;
}

.jumbosonic {
	margin:0px 0;
	text-align:center;
	transition:width .5s,height .5s,margin .5s,padding .5s;
	clear: both;
}

.jumbosonic h1 {
	color:#f8f8f8;
	font-family:inherit;
	font-size:50px;
	font-weight:700;
	line-height:1;
	margin:15px 0;
	cursor:default;
	text-rendering:optimizelegibility
}

.jumbosonic .lead {
	font-size:21px;
	font-weight:200;
	line-height:30px;
	margin-bottom:20px;
	transition:font-size .5s
}

.jumbosonic .btn {
    background: rgba(0, 0, 0, 0.1);
    border: 4px dashed rgba(0, 0, 0, 0.5);
    border-radius: 3px;
    color: rgba(0, 0, 0, 0.5);
    cursor: pointer;
    display: inline-block;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size:22px;
	font-weight:300;
    padding: 52px 48px;
    
    transition: background .25s,width .5s,height .5s;
    transition: color .25s;
    min-width: 96%;
    height: 135px;
    margin-bottom: 15px;
}

.jumbosonic .btn:hover,.jumbosonic .btn:active,.jumbosonic .btn:focus,.jumbosonic .btn.drop {
	background:rgba(0, 0, 0, 0.15);
	text-decoration:none;
	color: rgba(0, 0, 0, 0.75);
}

#no-file-api {
	display:none
}

#upload-input {
	position:absolute;
	top:0;
	left:-5000px
}

#upload-filelist {
	list-style-type:none;
	margin:20px 50px;
	padding:0;
	text-align:left
}

.completed#upload-filelist {
	background: rgb(245, 245, 245);
	padding: 15px;
    margin: 15px;
    border: 2px solid #c5dcf5;
}
.error#upload-filelist {
    color: #a24235;
	background: #ffe9e8 !important;
}

.error#upload-filelist .file-size {
	color:#ab5a32
}

.error#upload-filelist .file-progress {
	display:none
}

#upload-filelist>li {
	margin-top:5px;
	overflow:hidden
}

#upload-filelist>li.total {
	border-top:1px solid rgba(0,0,0,0.4);
	font-weight:700;
	padding-top:5px
}

.file-name {
    float: left;
    /* overflow: hidden; */
    max-width: 70%;
    /* text-overflow: clip; */
    /* white-space: nowrap; */
}

.file-size,.file-url {
	display:inline-block;
	float:right;
	font-size:.9em;
	margin-left:8px;
	color:#2F2F2F;
	vertical-align:middle
}

.file-url a {
    color: #f5f5f5;
    font-size: 14px;
    background: #333544;
    padding: 5px 10px 5px 10px;
    line-height: 26px;
}

.file-url a:hover {
	color:#dedede;
}

.completed .file-progress,.completed .file-size {
	display:none
}

.completed .file-url {
	display:block
}

.progress-outer {
    background-color: rgba(255,255,255,0.8);
    border: 1px solid #333;
    display: inline-block;
    font-size: 0;
    float: right;
    height: 15px;
    margin: 1px 1px 0px 15px;
    overflow: hidden;
    vertical-align: middle;
    width: 42%;
}

.progress-inner {
	background-color: #333544;
	height: 15px;
	margin: 0px
	width:0
}

.lolwhat {
  content: "";
  background: url('/static/bg.jpg') no-repeat center center fixed;
    background-size: cover;

  opacity:0.09;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -4;   
}
.domainsinfo {
  font-size:0.7em;
  position: absolute;
  z-index: 0;   

}

.notfoundbg {
  content: "";
  background: url('/static/404.jpg') no-repeat center center fixed;
  opacity:0.4;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;   
}
@media only screen and (max-device-width:880px),only screen and (max-width:880px) {
.header .logo {margin: 0 auto;width: 320px;float: none;padding-left: 0px;}
.header .header-text,.header .header-text-home {width: 100%;float: none; margin: 0 auto; clear: both;}
.stats {text-align: center;margin-right: 0%; }
}

@media only screen and (max-device-width:320px),only screen and (max-width:400px) {
	.jumbosonic{margin:0px 0px 20px 0px}
	.jumbosonic .lead{font-size:18px}
	.header .header-text,.header .header-text-home {width: 100%;float: none; margin: 0 auto; clear: both;}
	.header .sitename {font-size:52px;}
	.header .slogan {font-size:30px;}
	.header .instruct {font-size:18px;}
	/*.jumbosonic .btn,.alert,#upload-filelist{font-size:22px;border-radius:0;border-width:1px 0;width:100%;margin-left:0;margin-right:0;padding-left:20px;padding-right:20px;margin-bottom:20px;}*/
	#upload-filelist{overflow:hidden}
	#upload-filelist>li.file{margin-top:12px;margin-bottom:12px}
	.file-progress{float:left;width:70%}
	.file-size{float:left;max-width:30%;overflow:hidden}
	.file-name,.file-url{width:100%;max-width:100%}
	.file-url a{margin-left:10px}
	.file-url a:before{content:"https://"}
}

