.body-wrapper { margin-bottom: 0px; }

.main-wrapper { width: 90%; margin: 30px auto; text-align: center; }

.header-text { color: #484848; text-align: center; }
.header-text h3 { font-size: 24px; font-weight: normal; }
.header-text p { font-size: 14px; margin-top: 10px; }
.header .header-tabs .header-tab span { display: inline-block; vertical-align: middle; color: #ffffff;  text-transform: uppercase; font-size: 16px; }

.main-wrapper .block-center { width: 100%; }

#upload-url-wrapper { color:#484848; font-size: 12px; text-align: center; margin: 20px auto; background: #fafafa; border: 1px solid #d7d7d7; padding: 15px; }
#upload-url-wrapper p { margin: 5px; font-weight: bold; }
#upload-url-wrapper .upload-url-header-text { margin: 0 auto; vertical-align:middle; background: url('/img/design/youtube_logo.png') no-repeat; height: 30px; padding: 7px 0 0 50px; width: 280px; font-size: 15px; color: #5d89ba; }

#upload-url-wrapper .url-file-wrapper { height: 60px; margin: 10px auto; }
#upload-url-wrapper .url-file-wrapper input { color: #737373; width: 650px; height: 100%; margin: 0 auto; font-family: verdana; font-size: 20px; -webkit-border-radius: 35px; -moz-border-radius: 35px; border-radius: 35px; outline: none; border: 2px solid #5d89ba; padding: 0 15px 0 15px; }
#upload-url-wrapper .url-upload-button-wrapper { margin: 20px auto; }

#youtube_preparing { display:none; line-height: 25px; vertical-align: middle; font-size: 14px; color: gray; padding-left: 0px; }

#content-wrapper { text-align: center; width: 100%; }

#video-preview { padding: 0 20px 0 0; margin: 0 auto; display: none; text-align: center; }
#video-preview #video-title { text-align: left; font-family: Verdana, Geneva, sans-serif; font-size: 18px; padding: 10px 0 5px 10px; color: #676767; }
#video-preview #video-content { width: 500px; height: 281px; margin-right: 10px; }
#d-youtube-player { height: 100%; width: 100%; }
//#video-preview #gif-preview-background { width: 500px; height: 281px; background: #fff; position: absolute; top: 0; left 0; font-family: courier; font-size: 14px; text-align: center; display: none; }
#video-preview #gif-preview-background { width: 500px; height: 281px; background: #fff; font-family: courier; font-size: 14px; text-align: center; display: none; }
#video-preview #gif-preview-background #gif-preview-loading-text { padding-top: 140px; height: 280px; }
#video-preview #gif-preview-background #gif-preview { position: relative; top: 50%; transform: translateY(-50%); display: none; }

#gif-options { height: 360px; display: none; margin: 0; padding: 0 0 0 20px; vertical-align: top; }
#gif-options .time-option { vertical-align: middle; display: inline-block; height: 35px; border: 1px solid #484848; font-size: 25px; color: #b4b4b4; text-align: center; padding: 0 10px 0 10px; }
#gif-options .gif-options-text { padding-right: 10px; font-size: 25px; color: #909090; display: inline-block; text-align: right; width: 150px; }
#gif-options input[type=text] { border: 2px solid #909090; height: 100%; font-family: Arial; font-size: 40px; color: #5d89ba; padding-left: 15px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

#gif-options .options-header-wrapper { vertical-align: middle; padding-top: 0px; color: #909090; font-size: 40px; }
#gif-options .options-header-wrapper #options-header-stub { padding-right: 10px; font-size: 25px; color: #909090; display: inline-block; text-align: right; width: 150px; }
#gif-options .options-header-wrapper .options-header-text { display: inline-block; }
#gif-options .options-header-wrapper .options-header-text #options-header-div-min { width: 80px; font-size: 18px; color: #909090; text-align: center; display: inline-block; }
#gif-options .options-header-wrapper .options-header-text #options-header-div-sec { width: 115px; font-size: 18px; color: #909090; text-align: center; display: inline-block; }

#gif-options #gif-start-wrapper { vertical-align: middle; color: #909090; font-size: 40px; }
#gif-options #gif-start-wrapper .gif-start-time { display: inline-block; }
#gif-options #gif-start-wrapper .gif-start-time #video-start-time-min { width: 80px; } 
#gif-options #gif-start-wrapper .gif-start-time #video-start-time-sec { width: 115px; }

#gif-options #gif-duration-wrapper { vertical-align:middle; padding-top: 20px; color: #909090; font-size: 40px; }
#gif-options #gif-duration-wrapper .gif-duration-time { display: inline-block; }
#gif-options #gif-duration-wrapper .gif-duration-time #video-duration-min { border: none; width: 80px; }
#gif-options #gif-duration-wrapper .gif-duration-time #video-duration-sec { width: 115px; }

#gif-options .options-footer-wrapper { vertical-align: middle; color: #909090; font-size: 40px; height: 0px; }
#gif-options .options-footer-wrapper #options-footer-stub { padding-right: 10px; font-size: 25px; color: #909090; display: inline-block; text-align: right; width: 150px; }
#gif-options .options-footer-wrapper .options-footer-text { display: inline-block;  height: 0px; }
#gif-options .options-footer-wrapper .options-footer-text #options-footer-text-stub { width: 80px; font-size: 25px;  color: #909090; text-align: center; display: inline-block; }
#gif-options .options-footer-wrapper .options-footer-text #options-footer-text-sec { width: 115px; font-size: 12px; font-weight: bold;  vertical-align: top; color: #909090; text-align: center; display: inline-block; }

#gif-options #gif-buttons-wrapper { margin-top: 30px; }
#gif-options #gif-buttons-wrapper #waiter_save { display:none; font-size: 12px; color: #909090; color: #909090; margin-top: 15px; }
#gif-options #gif-buttons-wrapper #waiter_save #generate-text { display: none; }
#gif-options #gif-buttons-wrapper #error-2 { margin: 20px; }
#gif-options #gif-buttons-wrapper #youtube_preview { width: 130px; }
#gif-options #gif-buttons-wrapper #youtube_change { width: 130px; margin-bottom: 20px; display: none; }
#gif-options #gif-buttons-wrapper #youtube_generate { width: 130px; display:none; }

.block-text { margin-top: 80px; }

@media screen and (max-width: 1024px){
	#video-preview #video-title { display: none; }
}

@media screen and (max-width: 800px){
	.main-wrapper { width: 100%; margin: 15px auto; }
	.header-text h3 { font-size: 12px; }
	.main-wrapper .block-center { width: 94%; margin: 0 auto; }
	#upload-url-wrapper .url-file-wrapper { height: 40px; margin-bottom: 30px; }
	#upload-url-wrapper .url-file-wrapper input { width: 90%; font-size: 12px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; }
	.header .header-tabs { display: none; }
}

@media screen and (max-width: 600px){
	#video-preview { width: 100%; padding: 0px; }
	#video-preview #video-content { width: 100%;  margin: 0 auto; }
	#video-preview #gif-preview-background { width: 100%; }
	#video-preview #gif-preview-background #gif-preview { width: 100%; }

	#gif-options { display: none; margin: 0; padding: 0px; vertical-align: top; width: 100%; height: auto;  }
	#gif-options .time-option { height: 20px; border: 1px solid #484848; font-size: 15px; }
	#gif-options .gif-options-text { padding-right: 20px; font-size: 16px; width: 35%; text-align: right; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
	#gif-options input[type=text] { border: 2px solid #909090; height: 100%; font-family: Arial; font-size: 20px; color: #5d89ba; padding: 2px 15px 2px 15px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

	#gif-options .options-header-wrapper { font-size: 15px; text-align: left; }
	#gif-options .options-header-wrapper #options-header-stub { width: 35%; padding: 0; margin: 0; }
	#gif-options .options-header-wrapper .options-header-text { display: inline-block; width: 55%; text-align: left; }
	#gif-options .options-header-wrapper .options-header-text #options-header-div-min { width: 60px; height: 20px; font-size: 12px; text-align: center; margin: 0; }
	#gif-options .options-header-wrapper .options-header-text #options-header-div-sec { width: 80px; font-size: 12px; text-align: center; padding: 0; margin: 0; padding: 0 0 0 10px;}

	#gif-options #gif-start-wrapper { vertical-align: middle; color: #909090; font-size: 20px; text-align: left; }
	#gif-options #gif-start-wrapper .gif-start-time { display: inline-block; width: 55%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding-left: 0px; }
	#gif-options #gif-start-wrapper .gif-start-time #video-start-time-min { width: 60px; } 
	#gif-options #gif-start-wrapper .gif-start-time #video-start-time-sec { width: 80px; }

	#gif-options #gif-duration-wrapper { vertical-align:middle; padding-top: 20px; color: #909090; font-size: 20px; text-align: left; }
	#gif-options #gif-duration-wrapper .gif-duration-time { display: inline-block; width: 55%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding-left: 0px; }
	#gif-options #gif-duration-wrapper .gif-duration-time #video-duration-min { border: none; width: 60px; text-align: center; }
	#gif-options #gif-duration-wrapper .gif-duration-time #video-duration-sec { width: 80px; }

	#gif-options .options-footer-wrapper { font-size: 15px; text-align: left; }
	#gif-options .options-footer-wrapper #options-footer-stub { width: 35%; padding: 0; margin: 0; }
	#gif-options .options-footer-wrapper .options-footer-text { display: inline-block; width: 55%; text-align: left; padding: 0; margin: 0; vertical-align: top; }
	#gif-options .options-footer-wrapper .options-footer-text #options-footer-text-stub { width: 50px; font-size: 12px; text-align: center; margin: 0; padding: 0;}
	#gif-options .options-footer-wrapper .options-footer-text #options-footer-text-sec { width: 110px; font-size: 10px; font-weight: normal; text-align: right; margin: 0; padding: 0;}

	#gif-options #gif-buttons-wrapper { margin: 0px; }
	#gif-options #gif-buttons-wrapper #youtube_preview { width: 130px; }
	#gif-options #gif-buttons-wrapper #youtube_change { width: 130px; margin: 5px auto 0px auto; display: none; }
	#gif-options #gif-buttons-wrapper #youtube_generate { width: 130px; display:none; margin: 0px auto; }
	
	.block-text { width: 94%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin: 30px auto 0px auto; }
	
}
@media screen and (max-width: 320px){
	#upload-url-wrapper .upload-url-header-text { padding: 7px 0 0 40px; font-size: 14px; }
}