@font-face {
  font-family: Vazir;
  src: url('../font/Vazir-Bold.eot');
  src: url('../font/Vazir-Bold.eot?#iefix') format('embedded-opentype'),
       url('../font/Vazir-Bold.woff') format('woff'),
       url('../font/Vazir-Bold.ttf') format('truetype');
  font-weight: bold;
}

@font-face {
  font-family: Vazir;
  src: url('../font/Vazir-Medium.eot');
  src: url('../font/Vazir-Medium.eot?#iefix') format('embedded-opentype'),
       url('../font/Vazir-Medium.woff') format('woff'),
       url('../font/Vazir-Medium.ttf') format('truetype');
  font-weight: 500;
}

@font-face {
  font-family: Vazir;
  src: url('../font/Vazir.eot');
  src: url('../font/Vazir.eot?#iefix') format('embedded-opentype'),
       url('../font/Vazir.woff') format('woff'),
       url('../font/Vazir.ttf') format('truetype');
  font-weight: normal;
}

@font-face {
  font-family: Vazir;
  src: url('../font/Vazir-Light.eot');
  src: url('../font/Vazir-Light.eot?#iefix') format('embedded-opentype'),
       url('../font/Vazir-Light.woff') format('woff'),
       url('../font/Vazir-Light.ttf') format('truetype');
  font-weight: 300;
}

@font-face {
  font-family: Vazir;
  src: url('../font/Vazir-Thin.eot');
  src: url('../font/Vazir-Thin.eot?#iefix') format('embedded-opentype'),
       url('../font/Vazir-Thin.woff') format('woff'),
       url('../font/Vazir-Thin.ttf') format('truetype');
  font-weight: 200;
}

body {
	direction:rtl;
	font-family:Vazir;
	font-size:16px;
	text-align:center;
	font-weight: 500;
}
.dark {
	background-color:black;
	font-weight: 200;
}
h1 {
	font-weight: normal;
	background-color: #ebebeb;
	margin-bottom: 10px;
	margin-top: 0;
}
h2 {
	font-weight: 200;
	margin-top: 0;
}
select, input, button {
	font-family:Vazir;
	font-size:16px;
	font-weight: normal;
}
input#date {
	text-align: left;
	direction: ltr;
	width:100px;
}
#block ul li button {
    margin: 0 15px;
}
#block ul li {
	display: block;
	margin: 5px;
	float: right;
	
}
#block ul li a {
	display: block;
	width: 220px;
	height: 146px;
	background: url('../img/loading.gif') no-repeat center;
}
#block ul li img {
	width: 100%;
	height: 100%;
}
#block ul li p {
	margin: 5px;
}
#block ul li input {
	width: 100%;
	border: 1px solid #ccc;
	color: #aaa;
}
footer {
	background-color:#dfdfdf;
	padding:45px;
	margin-top: 30px;
	font-weight: 100;
}
.clear {
	clear:both;
}
.error {
	padding: 100px;
}
#date_btn {
	vertical-align: middle;
}
.video-content {
	width: 100%;
	max-width: 640px;
	margin: 0 auto;
}
#load-url {
	padding-top: 10px;
}
#load-url input {
	margin-left: 5px;
	min-width: 450px;
	padding: 5px;
	direction: ltr;
	background-color: #656565;
	border: 1px solid #909090;
	font-size:14px;
}
#load-url button {
	margin-left: 5px;
	border: 1px solid #ebebeb;
	background-color: #c2c2c2;
	font-size:14px;
	padding: 4px;
}
.dark p, .dark span, .dark a, .dark a:link {
	color: #696969;
}
.video-js {
	margin:0 auto;
}
.note {
    max-width: 640px;
    margin: 25px auto;
    border: 1px solid #696969;
    padding: 15px;
    background-color: rgb(23, 23, 23);
	color: #696969;
    border-radius: 6px;
}
code.mCustomScrollbar {
	word-break:break-all;
	direction:ltr;
	display:block;
	height:37px;
}
a.button, a.button:link {
    border: 1px solid #ebebeb;
    background-color: #c2c2c2;
    font-size: 14px;
    padding: 4px;
	color:#000;
	text-decoration: none;
	font-weight: 400;
}
a.button.disabled, a.button.disabled:link {
	cursor: default;
	color: #5a5a5a;
	background-color: #9a9a9a;
	border: 1px solid #5d5d5d;
}
.autonext-container {
	margin-top: 0;
	display: inline-block;
}
.autonext-container span {
	margin: 0 100px;
}