@media screen and (min-width: 320px) {
	.container {		width: 100%;	}
	.section-main {
		width: 100%;
		margin: 70px 0 70px;
	}

	.preview {
		width: 100%;
		margin: 0 auto 70px;
	}
	.p-upload, .p-copy, .p-share {
		-webkit-background-size: 56px;
		background-size: 56px;
		height: 56px;
	}
	.p-copy {			background-position: center -56px;		}
	.p-share {		background-position: center -112px;		}
	.p-arrow {
		margin: 24px 0 0;
		width: 3%;
	}
	.p-title {								width: 27%;								}
	.p-title:first-child {		margin-left: 6.3%;				}
	.p-title p, .dl-title {		font-size: 15px;					}

	.upload-form {    				width: 100%;  						}
  .progress {
  	height: 44px;
    width: calc(100% - 140px);
  }
  .btn-success {  	top: -44px;  				}
  .btn {  					line-height: 44px;  }
  .btn-upload, .btn-success {  	float: right;  }
  .btn-upload {  		width: 140px;  }
  .btn-success {  	width: 100%;  }
  .site-logo {  		text-align: center;  	}
  	.site-logo a {  float: none;  	}
  .site-title {  		display: none;  }
  .section-dl {  		padding: 10px 0;  }
  .section-dl .container {  	text-align: center;  }
  .dl-title {
  	width: 100%;
  	padding: 0 0 0 0;
  	display: inline-block;
  }
  footer {  				padding: 35px 0 5px;  }
  .footer-title {  	display: none;  			}
  footer .nav {
  	padding: 0;
  	text-align: center;
  }
  footer .nav li:first-child {  	padding-left: 0;  }

  .error-message, .error-message-img {
    margin: 160px auto 150px;
    padding: 90px 0 0 0;
    width: 100%;
    text-align: center;
  }
  .error-message h2, .error-message-img h2 {		font-size: 24px;  }
  .error-message, .error-message-img {					background-position: top center;  }

	.rules-icon {		display: none;	}
	.rules-body h2 {
		margin-bottom: 18px;
		font-size: 30px;
	}

	.copy-to {
		position: relative;
		left: -5px;
	}
	.ui-tooltip {
		top: 0;
		left: 15px;
		padding: 8px 0;
		text-align: center;
		width: 95%;
	}
}

@media screen and (min-width: 576px) {
	.site-logo a {		float: left;	}
	.site-title {
		display: block;
		letter-spacing: -0.5px;
		float: left;
		padding-left: 10px;
	}
	.section-main {    margin: 125px 0 100px;	}
	.preview {
		margin: 0 auto 75px;
		width: 420px;
	}
	.p-title {		width: 100px;		}
		.p-title:first-child {			margin-left: 0;		}
		.p-upload,
    .p-copy,
    .p-share {
       width: 100%;
       height: 80px;
       -webkit-background-size: 80px;
       background-size: 80px;
    }
    .p-copy {     	 background-position: center -80px;    }
    .p-share {      background-position: center -160px;    }
    .p-arrow {
      margin: 34px 24px 0;
			width: 10px;
    }

    .section-dl {    	padding: 25px 0;  	}
  	.dl-logo, .dl-title {
  		float: left;
  		width: auto;
  	}
  	.p-title p, .dl-title {  			font-size: 18px;  			}
  	.section-dl .container {	    text-align: left;				}
  	.footer-title {
  		display: block;
  		padding-bottom: 15px;
  	}
  	footer {	  									padding: 45px 0 25px;	  }

  	.error-message h2, .error-message-img h2 {			font-size: 30px;  	}
  	.error-message, .error-message-img {
	    margin: 160px auto 150px;
	    padding: 6px 0 10px 95px;
	    width: 440px;
	    text-align: left;
	  }
	  .error-message, .error-message-img {						background-position: top left;  }

}


@media screen and (min-width: 768px) {
	.section-dl {			padding: 44px 0;				}
	.dl-title {    		padding: 12px 0 0 5px;  }
  .site-title {  		letter-spacing: 0;  		}
  .progress {  			height: 48px;  					}
  .btn-success {  	top: -48px;  						}
  .btn {  					line-height: 48px;  		}
  .error-message, .error-message-img {	    margin: 240px auto;	}

  .rules-icon {		display: block;	}
	.rules-body h2 {
		margin-bottom: 23px;
		font-size: 36px;
	}

}


@media screen and (min-width: 992px) {
	.section-main {
    margin: 185px 0 190px;
	}
	.container {
    width: 970px;
  }
  footer div.pull-left {
  	width: 600px;
  }
  .upload-form {
    width: 780px;
  }
  .progress {
    width: 550px;
  }
  .btn-upload {
  	float: left;
    margin-left: 550px;
    width: 230px;
  }
  .btn-success {
  	width: 780px;
  }
  footer {	  									padding: 55px 0}

  .error-message,
  .error-message-img {
      margin: 240px auto;
      padding: 6px 0 10px 95px;
      width: 440px;
  }

}