@font-face {
  font-family: "iransans";
  src: url("./iranSansWeb/IRANSansWeb_FaNum.eot");
  src: url("./iranSansWeb/IRANSansWeb_FaNum.eot") format("embedded-opentype"), url("./iranSansWeb/IRANSansWeb_FaNum.woff2") format("woff2"), url("./iranSansWeb/IRANSansWeb_FaNum.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
html {
  font-size: 14px;
}

body {
  background-image: url(back2.jpg);
  background-size: cover;
  font-family: iransans;
}

html, body {
  padding: 0;
  margin: 0;
}

html, body, .container {
  height: 100%;
}

.container {
  /*background: rgba(0, 0, 0, 0.2);*/
  text-align: center;
  color: #fff;
  box-sizing: border-box;
}
.container .content {
  display: grid;
  grid-template-columns: 25% 50% 25%;
  position: relative;
}

.movies-container .list .item {
  border: solid 1px;
  /*width: 200px;*/
  width: 170px;
  box-sizing: border-box;
  clear: both;
  color: #fff;
  cursor: pointer;
  transition: 0.2s;
}
.movies-container .list .item.disable {
  background: rgba(239, 28, 36, 0.2);
  color: rgba(255, 255, 255, 0.7);
  border-color: rgba(239, 28, 36, 0.3);
}
.movies-container .list .item.active {
  background: #FFC339;
  color: #000;
  border-color: #FFC339;
}
.movies-container .list .item:hover {
  color: #FFC339;
  background: transparent;
}
.movies-container .list .item:nth-child(even) {
  /*float: left;*/
}
.movies-container .list .item:nth-child(odd) {
  float: right;
}

.table-container table {
  width: 100%;
  table-layout: fixed;
  border-spacing: unset;
}
.table-container table thead {
  background: #FFC339;
  color: #0C8C85;
}
.table-container table thead th:first-child {
  border-left: solid 1px #000;
}
.table-container table thead th:last-child {
  border-right: solid 1px #000;
}
.table-container table thead th:not(:first-child):not(:last-child) {
  border-right: solid 1px #000;
  border-left: solid 1px #000;
}
.table-container table tbody tr:nth-child(odd) {
  background: rgba(0, 0, 0, 0.4);
}
.table-container table tbody tr:nth-child(even) {
    background: rgba(255, 195, 54, 0.07);
}
.table-container table tbody td {
  border: solid 1px #FFC339;
}
.table-container table tbody td:first-child {
  color: #FFC339;
  font-weight: bold;
}

.header {
  width: 50%;
  margin: 0 auto;
  box-sizing: border-box;
  position: relative;
}
.header p {
  flex: 1;
  font-size: 2rem;
  font-weight: bold;
  margin: 0;
  transition: 0.2s;
}
.header .details {
  padding: 0 60px;
  position: absolute;
  right: 0;
  left: 0;
  bottom: 0;
  top: -100%;
  transition: 0.2s;
}
.header .details .name {
  font-size: 24px;
  font-weight: bold;
}
.header .details .d-flex > div {
  flex: 1;

}
.header.show-details .details {
  top: 0;
}
.header.show-details p {
  visibility: hidden;
  opacity: 0;
}

.d-flex {
  display: flex;
}

.p-1 {
  padding: 0.25rem;
}

.pt-1 {
  padding-top: 0.25rem;
}

.pr-1 {
  padding-right: 0.25rem;
}

.pl-1 {
  padding-left: 0.25rem;
}

.pb-1 {
  padding-bottom: 0.25rem;
}

.py-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}

.px-1 {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}

.m-1 {
  margin: 0.25rem;
}

.mt-1 {
  margin-top: 0.25rem;
}

.mr-1 {
  margin-right: 0.25rem;
}

.mb-1 {
  margin-bottom: 0.25rem;
}

.ml-1 {
  margin-left: 0.25rem;
}

.my-1 {
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
}

.mx-1 {
  margin-right: 0.25rem;
  margin-left: 0.25rem;
}

.p-2 {
  padding: 0.5rem;
}

.pt-2 {
  padding-top: 0.5rem;
}

.pr-2 {
  padding-right: 0.5rem;
}

.pl-2 {
  padding-left: 0.5rem;
}

.pb-2 {
  padding-bottom: 0.5rem;
}

.py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.px-2 {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.m-2 {
  margin: 0.5rem;
}

.mt-2 {
  margin-top: 0.5rem;
}

.mr-2 {
  margin-right: 0.5rem;
}

.mb-2 {
  margin-bottom: 0.5rem;
}

.ml-2 {
  margin-left: 0.5rem;
}

.my-2 {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

.mx-2 {
  margin-right: 0.5rem;
  margin-left: 0.5rem;
}

.p-3 {
  padding: 0.75rem;
}

.pt-3 {
  padding-top: 0.75rem;
}

.pr-3 {
  padding-right: 0.75rem;
}

.pl-3 {
  padding-left: 0.75rem;
}

.pb-3 {
  padding-bottom: 0.75rem;
}

.py-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.px-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

.m-3 {
  margin: 0.75rem;
}

.mt-3 {
  margin-top: 0.75rem;
}

.mr-3 {
  margin-right: 0.75rem;
}

.mb-3 {
  margin-bottom: 0.75rem;
}

.ml-3 {
  margin-left: 0.75rem;
}

.my-3 {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}

.mx-3 {
  margin-right: 0.75rem;
  margin-left: 0.75rem;
}

.p-4 {
  padding: 1rem;
}

.pt-4 {
  padding-top: 1rem;
}

.pr-4 {
  padding-right: 1rem;
}

.pl-4 {
  padding-left: 1rem;
}

.pb-4 {
  padding-bottom: 1rem;
}

.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}

.m-4 {
  margin: 1rem;
}

.mt-4 {
  margin-top: 1rem;
}

.mr-4 {
  margin-right: 1rem;
}

.mb-4 {
  margin-bottom: 1rem;
}

.ml-4 {
  margin-left: 1rem;
}

.my-4 {
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.mx-4 {
  margin-right: 1rem;
  margin-left: 1rem;
}

/*# sourceMappingURL=css.css.map */
.glow {
    color: #fff;
    font-weight: bolder;
    background-color: rgba(241, 20, 20, 0.55);
    text-decoration: underline;
    text-align: center;
    -webkit-animation: glow 1s ease-in-out infinite alternate;
    -moz-animation: glow 1s ease-in-out infinite alternate;
    animation: glow 1s ease-in-out infinite alternate;

}

@-webkit-keyframes glow {
    from {
        text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #f4c128, 0 0 40px #e6d58d, 0 0 50px #e60073, 0 0 60px #e60073, 0 0 70px #e60073;
        box-shadow: 2px 2px 4px #f6e37a;
    }
    to {
        text-shadow: 0 0 20px #fff, 0 0 30px #dac067, 0 0 40px #b2a739, 0 0 50px #e8e583, 0 0 60px #ff4da6, 0 0 70px #ff4da6, 0 0 80px #ff4da6;
        box-shadow: 3px 3px 8px #fad400;
    }
}