/* CSS Document */


.upload-item-circle1 {
		width: 70px;
    margin: auto;
    border-radius: 50%;
    height: 70px;
    background-color: #333333;
    padding-top: 5px;
		
	}
	.upload-item-circle2{ color: black;
		width: 62px;
    margin: auto;
    border-radius: 50%;
    height: 65px;
    background-color: white;
	}
	.file-info-label {
		font-weight: 600;
		width: 80px;
		display: inline-block;
		text-align: left;
	}
	.dz-success-mark, .dz-error-mark { display: none}
	#drop-error { color: red}
	#submit-upload:disabled {
		
	}
	#titre-video {
		font-size: 20px;
    line-height: 26px;
    font-weight: 500;
	}
	#byte-send {
		    line-height: 26px;
	}
	#upload-step-1 {
		width: 80%;
    	margin: auto;
	}
	#upload-step-1 .upload-info { margin: 15px 0;
		display: block;
		width: 100%;
	}
	#upload-step-1 .upload-info li {
		float: left;
		width: 33%;
		text-align: center; display: block
	}
	.upload-info-item {
		
	}
	#upload-step-1 .upload-info li span { font-size: 13px;}
	#upload-step-1 .upload-intro {
		margin: 30px 0;
	}
	#upload-step-1 .upload-intro li {
		line-height: 1.7em;
    font-size: 1.1em;
	}
	#dropzone:hover, #dropzone.dz-drag-hover {
		background-color: #f1f1f1;
		border-color: #e30613;
	}
	#dropzone:hover i, #dropzone.dz-drag-hover i {
		color: #e30613
	}
	#dropzone:hover .drop-button, #dropzone.dz-drag-hover .drop-button {
		background-color: #e30613; color: white  !important;
	}
	
	.drop-button {
		font-size: 16px;
    	font-weight: 600;
		line-height: 22px;
		background-color: #484848;
		display: inline-block;
		color: white;
		padding: 5px 15px;
		margin: 5px;
		border-radius: 5px;
			
		transition: background-color .15s linear;
	}
	#dropzone:hover .drop-button:hover {
		background-color: #c7010d !important;
	}
	#dropzone:hover .drop-button:active {
		background-color: #191818 !important;
	}
	#upload-step-2 {
		
		display: none;
	}
	#dropzone {
		border: 2px dashed #707070;
		border-radius: 15px;
		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, border-color .25s;
		background-color: #d2d2d2;
		padding: 25px;
		text-align: center;
		font-size: 20px;
		line-height: 45px;
	}
	#dropzone svg{
		font-size: 60px;
    	line-height: 90px;	
		transition: color .15s linear;
	}
	#dropzone:hover {
		cursor: pointer
	}
	#upload-step-2 {
		
		width: 85%;
    margin: auto;
	}
	
	
	
	#step-2-left {
		width: 80%;
		float: left;
		background-color: #d2d2d2;
	}
	#step-2-right {
		float: left;
		width: 20%
	}
	#step-2-left-left {
		float: left;
    	width: 10%;
	}
	#step-2-left-right {
		float: left;
    	
	}
	#step-2-left-left,#step-2-left-right,#step-2-right {
		box-sizing: border-box;
		padding: 20px;
		max-width: 100%
	}
	#progress-bar-outer {
		background-color: azure;
    	height: 5px;
	}
	#progress-bar-inner {
		height: 5px;
    	width: 0%;
    	background: red;
		-webkit-transition: width 1s;
  		transition: width 1s,background-color .5s linear;
	}
		.ruban { 
		    background-color: black;
    height: 58px;
    width: 70px;
    float: left;
margin-right: 10px;
		}
		.ruban-left  { float: left; 
			
		}
		.ruban-middle {
			float: left; width: 60%;
			text-align: center;
			 box-sizing: border-box;
			line-height: 58px;
			color: white;
    font-size: 18px;
		}
		.ruban-right { float: right; 
			
		}
		.ruban-left , .ruban-right { width: 20%; box-sizing: border-box}
		.trou { width: 5px; height: 5px; background-color: white;
		margin: 4px;}
		#upload-step-2-bottom {text-align: right;
    padding: 15px;}

.night #dropzone {background-color: #303030}
.night .drop-button {background-color:#dadada; color: #303030}
.night #step-2-left {
	background-color:#1c1c1c;
}
.upload_websiteinfo {
	text-align:center;width:80%;color:#d362a1
}


@media screen and (max-width: 500px) {
	.upload_websiteinfo {
		width:100%;
}
	#upload-step-2 {
		width: 100%;
	}
	#step-2-left {
		width: 100%;
	}
	#step-2-left-left,#step-2-left-right,#step-2-right {
		box-sizing: border-box;
		padding: 5px;
		max-width: 100%
	}
	#step-2-right { display: none}
	#submit-upload { box-sizing: content-box !important}
	#upload-step-2-bottom { text-align: left;}
}