@font-face {

  font-family: 'byekan';

  src: url('../fonts/BYekan.eot?#') format('eot'), url('../fonts/BYekan.woff') format('woff'), url('../fonts/BYekan.ttf') format('truetype');

}

@font-face {

  font-family: 'IRANYekan';

  src: url('../fonts/IRANYekan.eot?#') format('eot'), url('../fonts/IRANYekan.woff2') format('woff2'), url('../fonts/IRANYekan.ttf') format('truetype');

}

@font-face {

  font-family: 'IRANSans_bold';

  src: url('../fonts/eot/IRANSansWeb_Bold.eot?#iefix') format('embedded-opentype'), 

  url('../fonts/woff2/IRANSansWeb_Bold.woff2')           format('woff2'), 

  url('../fonts/woff/IRANSansWeb_Bold.woff')            format('woff'), 

  url('../fonts/ttf/IRANSansWeb_Bold.ttf')             format('truetype');

}

@font-face {

  font-family: 'IRANSans_light';

  src: url('../fonts/eot/IRANSansWeb_Light.eot?#iefix') format('embedded-opentype'), 

  url('../fonts/woff2/IRANSansWeb_Light.woff2')           format('woff2'), 

  url('../fonts/woff/IRANSansWeb_Light.woff')            format('woff'), 

  url('../fonts/ttf/IRANSansWeb_Light.ttf')             format('truetype');

}

@font-face {

  font-family: 'IRANSans_ultralight';

  src: url('../fonts/eot/IRANSansWeb_UltraLight.eot?#iefix') format('embedded-opentype'), 

  url('../fonts/woff2/IRANSansWeb_UltraLight.woff2')           format('woff2'), 

  url('../fonts/woff/IRANSansWeb_UltraLight.woff')            format('woff'), 

  url('../fonts/ttf/IRANSansWeb_UltraLight.ttf')             format('truetype');

}

@font-face {

  font-family: 'IRANSans';

  src: url('../fonts/eot/IRANSansWeb.eot?#iefix') format('embedded-opentype'), 

  url('../fonts/woff2/IRANSansWeb.woff2')           format('woff2'), 

  url('../fonts/woff/IRANSansWeb.woff')            format('woff'), 

  url('../fonts/ttf/IRANSansWeb.ttf')             format('truetype');

}

@font-face {

  font-family: 'roboto';

  src:  url('../fonts/Roboto-Thin.ttf') format('truetype');

}

*{
  font-family: IRANSans;
}
p{
  margin-bottom: 0;
}
input:focus, input:active, select:focus, select:active , textarea{
  outline: none;
}
.button{
    margin-bottom: 0;
}
input[type="submit"]:hover{
  opacity: .9;
}
a:hover{
  opacity: .9;
}

body{
  background-color: #f8f8f8;
  padding: 15px;
}

.login_form{
  width: 100%;
  background-color: white;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -o-border-radius: 5px;
  margin-top: 100px;
  padding: 15px 15px 30px 15px;
  box-shadow: 0 1px 6px rgba(17, 17, 17, 0.15);
  -webkit-box-shadow: 0 1px 6px rgba(17, 17, 17, 0.15);
  -moz-box-shadow: 0 1px 6px rgba(17, 17, 17, 0.15);
  -o-box-shadow: 0 1px 6px rgba(17, 17, 17, 0.15);
  text-align: center;
}
.login_form input:not([type="submit"]){
  width: 100%;
  padding: 10px;
  border: 1px solid silver;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -o-border-radius: 3px;
  background-color: #e8f0fe !important;
  margin-bottom: 10px;
}
.login_form input[type="submit"]{
  width: 100%;
  background-color: #2ca5e0;
  color: white;
  padding: 10px;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -o-border-radius: 3px;
  border: none;
  cursor: pointer;
}
.state_btn{
  width: 100%;
  background-color: #74bfde;
  color: white;
  display: inline-block;
  padding: 5px 8px 5px 3px;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -o-border-radius: 5px;
  font-size: 13px;
}
.state_btn.disabled{
  width: 100%;
  background-color: #de7474;
}
.state_btn_padding{
  padding: 5px;
}
.state_btn > span.channelId{
  font-size: 10px;
  unicode-bidi: plaintext;
  direction: ltr;
  font-family: sans-serif;
}
.state_btn > span.count{
  font-size: 12px;
  color: yellow;
}
.queue_table{
  width: 100%;
  background-color: white;
  padding: 8px;
  border: 1px solid #ccc;
  position: relative;
  box-shadow: 0px 1px 5px rgba(17, 17, 17, 0.1);
  -webkit-box-shadow: 0px 1px 5px rgba(17, 17, 17, 0.1);
  -moz-box-shadow: 0px 1px 5px rgba(17, 17, 17, 0.1);
  -o-box-shadow: 0px 1px 5px rgba(17, 17, 17, 0.1);
}
.menu_box{
  position: absolute;
  top: -1px;
  right: -90px;
  width: 80px;
  background-color: white;
  text-align: center;
  padding: 12px;
  box-shadow: 0px 1px 5px rgba(17, 17, 17, 0.1);
  -webkit-box-shadow: 0px 1px 5px rgba(17, 17, 17, 0.1);
  -moz-box-shadow: 0px 1px 5px rgba(17, 17, 17, 0.1);
  -o-box-shadow: 0px 1px 5px rgba(17, 17, 17, 0.1);
  border: 1px solid #ccc;
}
.menu_box ul{
  list-style: none;
  margin: 0;
}
.menu_box ul li{
  padding-bottom: 10px;
}
.menu_box ul li:not(:first-child){
  margin-top: 15px;
}
.menu_box ul li:not(:last-child){
  border-bottom: 1px solid rgb(175, 199, 243);
}
.menu_box ul li a{
  color: cornflowerblue;
}
.menu_box ul li a.send{
  color: #2cca2c;
}
.menu_box ul li a.stop{
  color: #ca2c2c;
}
.menu_box ul li a.start{
  color: #2c83ca;
}
.menu_box span{
  font-size: 14px;
}
.queue_table h6{
  width: 100%;
  padding: 10px;
  text-align: center;
  font-family: IRANYekan;
  background-color: #caeeff;
  color: darkslategray;
  position: relative;
}
.queue_table h6 .remove_all{
  background-color: #fb6262;
  position: absolute;
  top: 8px;
  right: 8px;
  color: white;
  font-size: 14px;
  padding: 4px 5px 3px 5px;
  border-radius: 3px;
  cursor: pointer;
  border: none;
}
.queue_table h6 .remove_all:hover{
  opacity: .9;
}
.copy-btn{
  position: absolute;
  top: 8px;
  right: 8px;
  background-color: #2196f3;
  padding: 4px 5px 3px 5px;
  border-radius: 5px;
  font-size: 14px;
  display: inline-block;
  cursor: pointer;
  color: #fff;
}
.copy-btn:hover{
  opacity: .9;
}
.queue_table table{
  font-size: 14px;
}
.pagination{
  text-align: center;
  margin-bottom: 0.4rem;
}
.page-item.active{
  background-color: #a9e4e6;
  display: inline-block;
  padding: 3px 10px;
}
.online{
  width: 8px;
  height: 8px;
  border-radius: 15px;
  background-color: #25da95;
  animation: blink_ad normal 1.5s infinite ease-in-out;
  -webkit-animation: blink_ad normal 1.5s infinite ease-in-out;
  -moz-animation: blink_ad normal 1.5s infinite ease-in-out;
  -o-animation: blink_ad normal 1.5s infinite ease-in-out;
  -ms-animation: blink_ad normal 1.5s infinite ease-in-out;
  display: inline-block;
  margin-left: 8px;
}
@keyframes blink_ad {
  0% {
      background-color: #25da95;
  }
  50% {
      background-color: #e9eaea;
  }
  100% {
      background-color: #25da95;
  }
}
@-webkit-keyframes blink_ad {
  0% {
      background-color: #25da95;
  }
  50% {
      background-color: #e9eaea;
  }
  100% {
      background-color: #25da95;
  }
}
.online.red{
  width: 8px;
  height: 8px;
  border-radius: 15px;
  background-color: #da2525;
  animation: blink_ad_red normal 1.5s infinite ease-in-out;
  -webkit-animation: blink_ad_red normal 1.5s infinite ease-in-out;
  -moz-animation: blink_ad_red normal 1.5s infinite ease-in-out;
  -o-animation: blink_ad_red normal 1.5s infinite ease-in-out;
  -ms-animation: blink_ad_red normal 1.5s infinite ease-in-out;
  display: inline-block;
  margin-left: 8px;
}
@keyframes blink_ad_red {
  0% {
      background-color: #da2525;
  }
  50% {
      background-color: #e9eaea;
  }
  100% {
      background-color: #da2525;
  }
}
@-webkit-keyframes blink_ad_red {
  0% {
      background-color: #da2525;
  }
  50% {
      background-color: #e9eaea;
  }
  100% {
      background-color: #da2525;
  }
}
.open_sending_btn{
  background-color: #f4fff5;
  color: #799879;
  font-size: 14px;
  padding: 4px 7px;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -o-border-radius: 8px;
  box-shadow: inset 0 0 3px rgba(17, 17, 17, 0.2);
  -webkit-box-shadow: inset 0 0 3px rgba(17, 17, 17, 0.2);
  -moz-box-shadow: inset 0 0 3px rgba(17, 17, 17, 0.2);
  -o-box-shadow: inset 0 0 3px rgba(17, 17, 17, 0.2);
  margin: 25px 0 10px 0;
  display: inline-block;
  cursor: pointer;
}
.open_sending_btn:hover{
  opacity: .9;
}
.open_sending_btn > i{
  transition: ease-in-out .5s all;
  -webkit-transition: ease-in-out .5s all;
  -moz-transition: ease-in-out .5s all;
  -o-transition: ease-in-out .5s all;
}
.open_sending_btn.new{
  background-color: #fff4f4;
  color: #987979;
}
.open_sending_btn.newspaper{
  background-color: #f4f5ff;
  color: #797b98;
}
.open_sending_btn.add{
  background-color: #fffef4;
  color: #989779;
}
.rotate{
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transition: ease-in-out .5s all;
  -webkit-transition: ease-in-out .5s all;
  -moz-transition: ease-in-out .5s all;
  -o-transition: ease-in-out .5s all;
}
.top_like_btn{
  background-color: #f1f1f1;
  color: #848484;
  font-size: 14px;
  padding: 4px 7px;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -o-border-radius: 8px;
  box-shadow: inset 0 0 3px rgba(17, 17, 17, 0.15);
  -webkit-box-shadow: inset 0 0 3px rgba(17, 17, 17, 0.15);
  -moz-box-shadow: inset 0 0 3px rgba(17, 17, 17, 0.15);
  -o-box-shadow: inset 0 0 3px rgba(17, 17, 17, 0.15);
  margin: 25px 0 10px 0;
  display: inline-block;
}
.top_like_btn.no-padding-bottom{
  padding-bottom: 0;
}
.sending_box{
  width: 100%;
  padding-bottom: 20px;
  display: none;
}
.sending_box h6{
  width: 100%;
  padding: 8px;
  font-size: 15px;
  text-align: center;
  background-color: #74cfde;
  color: #276f7b;
  margin-bottom: 0;
  font-family: IRANYekan;
}
.sending_box textarea{
  width: 100%;
  resize: none;
  height: 250px;
  border-top-width: 0;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -o-border-radius: 0;
  border-color: #74cfde;
  padding: 10px 9px;
  font-size: 15px;
  color: #333;
  line-height: 1.7;
}
.sending_box input[type="text"] , .sending_box input[type="password"]{
  width: 100%;
  padding: 10px;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -o-border-radius: 3px;
  border: 1px solid #cecece;
  color: #333;
  margin-bottom: 8px;
  font-size: 15px;
}
.sending_box select{
  width: 100%;
  padding: 5px;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -o-border-radius: 3px;
  border: 1px solid #cecece;
  color: #333;
  margin-bottom: 8px;
  font-size: 15px;
}
.sending_box input[type="submit"]{
  width: 200px;
  background-color: #36bf5a;
  color: white;
  padding: 10px;
  border: none;
  border-radius: 3px;
  font-size: 15px;
  cursor: pointer;
}
table.users tr td{
  text-align: center;
}
table.states tr td{
  text-align: center;
}
.edit_btn{
  background-color: darkgray;
  color: white;
  border: none;
  padding: 0px 8px;
  border-radius: 2px;
  font-size: 13px;
  cursor: pointer;
}
.edit_btn:hover{
  opacity: .9;
}
.permission_btn{
  background-color: rgb(112, 189, 219);
  color: white;
  border: none;
  padding: 0px 8px;
  border-radius: 2px;
  font-size: 13px;
  cursor: pointer;
}
.permission_btn:hover{
  opacity: .9;
}
.permissions_submit_btn{
  background-color: rgb(40, 169, 40);
  color: white;
  border: none;
  padding: 10px 20px;
  border-radius: 2px;
  font-size: 14px;
  cursor: pointer;
}
.permissions_submit_btn:hover{
  opacity: .9;
}
.warning_text{
  color: red;
  font-size: 12px;
}
.sending_box input[type="submit"].colored{
  background-color: #3693bf;
}
.callout.success{
  background-color: #e4ffcf;
  color: #18863f;
  margin-bottom: -14px;
  margin-top: 20px;
  padding: 12px;
  font-family: IRANSans;
  font-size: 14px;
}
.callout.alert{
  color: #8e2727;
  margin-bottom: -14px;
  margin-top: 20px;
  padding: 12px;
  font-family: IRANSans;
  font-size: 14px;
}
.exit_queue_btn{
  background-color: #e89d47;
  color: white;
  border: none;
  padding: 3px 8px;
  border-radius: 2px;
  font-size: 13px;
  cursor: pointer;
}
.exit_queue_btn_all{
  background-color: #e84747;
  color: white;
  border: none;
  padding: 3px 8px;
  border-radius: 2px;
  font-size: 13px;
  cursor: pointer;
}
.continue_queue_btn{
  background-color: #47e86a;
  color: white;
  border: none;
  padding: 3px 8px;
  border-radius: 2px;
  font-size: 13px;
  cursor: pointer;
}
.setting_box{
  border: 1px solid rgb(209, 209, 209);
  padding: 15px;
  position: relative;
  margin-top: 20px;
}
.setting_box > span.title{
  background-color: white;
  position: absolute;
  top: -13px;
  font-size: 14px;
  color: #666;
  padding: 1px 5px;
  right: 4px;
}
/* checkboxes begin */

.md-checkbox {
  position: relative;
  margin: 1em 0;
  text-align: right;
  margin-right: 5px;
}
.md-checkbox.md-checkbox-inline {
  display: inline-block;
}
.md-checkbox label {
  cursor: pointer;
  display: inline;
  line-height: 1.25em;
  vertical-align: top;
  clear: both;
  padding-right: 1px;
}
.md-checkbox label:not(:empty) {
  padding-right: 0.35em;
  font-size: 14px;
  line-height: 1.7;
  color: #565656;
}
.md-checkbox label:before, .md-checkbox label:after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
}
.md-checkbox label:before {
  width: 1.3em;
  height: 1.25em;
  background: #fff;
  border: 2px solid rgba(0, 0, 0, 0.54);
  border-radius: 0.125em;
  cursor: pointer;
  transition: background 0.3s;
}
.md-checkbox input[type="checkbox"] {
  outline: 0;
  visibility: hidden;
  width: 1.25em;
  margin: 0;
  display: block;
  float: right;
  font-size: inherit;
}
.md-checkbox input[type="checkbox"]:checked + label:before {
  background: #337ab7;
  border: none;
}
.md-checkbox.red input[type="checkbox"]:checked + label:before {
  background: #b73333;
  border: none;
}
.md-checkbox input[type="checkbox"]:checked + label:after {
  transform: translate(0.25em, 0.3365384615em) rotate(-45deg);
  width: 0.75em;
  height: 0.375em;
  border: 0.125em solid #fff;
  border-top-style: none;
  border-right-style: none;
  margin-right: 7px;
}
.md-checkbox input[type="checkbox"]:disabled + label:before {
  border-color: rgba(0, 0, 0, 0.26);
}
.md-checkbox input[type="checkbox"]:disabled:checked + label:before {
  background: rgba(0, 0, 0, 0.26);
}

/* checkboxes end */

.settings_btn{
  width: 140px;
  background-color: #4cb1c1;
  color: white;
  font-family: IRANYekan;
  padding: 8px;
  border: none;
  font-size: 15px;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -o-border-radius: 3px;
  cursor: pointer;
}
.settings_image_outer{
  text-align: center;
  padding-top: 5px;
}
.settings_image_outer > img{
  width: 200px;
}
.settings_image_outer > input{
  display: none;
}
.settings_image_outer > label{
  background-color: #f0f0f0;
  color: #555;
  font-size: 15px;
  font-family: IRANYekan;
  padding: 4px 10px;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -o-border-radius: 3px;
  margin-top: 10px;
  display: inline-block;
  cursor: pointer;
}
.settings_image_outer > label:hover{
  opacity: .9;
}
.logo_outer{
  text-align: center;
  padding: 5px 5px 18px 5px;
}
.inactive_days_outer{
  text-align: center;
  padding: 0 5px 20px 5px;
}
.inactive_days_outer > span{
  color: maroon;
  font-size: 15px;
  font-family: IRANYekan;
}
.inactive_days_outer > ul{
  display: inline;
  margin-right: 8px;
}
.inactive_days_outer > ul > li{
  display: inline;
  background-color: #e4a127;
  color: white;
  padding: 2px 5px;
  font-size: 14px;
  font-family: IRANYekan;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -o-border-radius: 3px;
}
#sendTime{
  width: 200px;
  text-align: center;
  font-family: byekan;
}